@charset "utf-8";

@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(//use.fontawesome.com/releases/v5.0.13/css/all.css);

/*
	font-family:"FontAwesome";
	font-family:"Font Awesome 5 Free";
*/


/*========================================
 Base
========================================*/
html {font-size:62.5%;}
body {font-size:1.2rem;}
.ColorRed {color:#e14944;}
.Font16 {font-size:1.6rem;}
.Font13 {font-size:1.3rem;}
.CenterTxt {text-align:center;}
.MarTop20 {margin-top:20px;}


/* PC */
@media screen and (min-width: 641px) {
body{
    background:#ffefc1;
    background-size:50%;
    font-size:1.4rem;
    color:#8d4b45;
    text-align:center;
}
.spOnly {display:none;}


/* header */
header{
    width:1080px;
    margin:0 auto 20px;
}


/* 概要 */
section{
    padding:20px;
    border-radius:6px;
}
.wrap1000{
    position:relative;
    width:1000px;
    margin:0 auto 40px;
    text-align:left;
    line-height:1.7;
}

.Tit{
    display:block;
    position:relative;
    background:#e14944;
    height:50px;
    margin-bottom:0.8em;
    padding:0 1em;
    font-size:4rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    line-height:50px;
    box-sizing:border-box;
}
.Tit::before, .Tit::after{
    position:absolute;
    content:"";
    width:0;
    height:0;
    z-index:1;
}
.Tit::before{
    top:0;
    left:0;
    border-width:25px 0 25px 15px;
    border-color:transparent transparent transparent #ffefc1;
    border-style:solid;
}
.Tit::after{
    top:0;
    right:0;
    border-width:25px 15px 25px 0;
    border-color:transparent #ffefc1 transparent transparent;
    border-style:solid;
}
#Extra .Tit {font-size:3.4rem;}


/* nav */
nav ul{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    width:100%;
    line-height:1.2;
    border-top:1px dashed #e14944;
    border-bottom:1px dashed #e14944;
}
nav li{
    flex-grow:1;
    margin:0;
    padding:10px 0;
    font-size:24px;
    font-weight:bold;
    color:#ccc;
}
nav li a{
    display:block;
    padding:10px 0;
    color:#e14944;
    text-align:center;
    text-decoration:none;
    transition:.5s;
}
nav li a::before{
	font-family:"Font Awesome 5 Free";
    content:"\f101";
    position:relative;
    margin-right:4px;
}
nav li a:hover {color:#8d4b45;}

#AttentionOnlineLink{
    text-align:center;
    font-size:1.8rem;
}


/* 景品 */
#Gift p.Tit + p{
    margin-bottom:2rem;
    font-size:2.4rem;
    text-align:center;
    line-height:1.2;
}
#Gift p.Tit + p:first-line {background:linear-gradient(transparent 60%, #ffff66 60%);}
#Gift p.Tit + p span.FontSmall{
    background:none;
    font-size:1.5rem;
}

.ItemBox{
    background:#fff;
    margin-bottom:30px;
    padding:20px;
    border:2px solid #e14944;
    box-sizing:border-box;
}
dl.ItemTit{
    display:flex;
    position:relative;
    width:100%;
    margin:0;
    color:#e14944;
}
dl.ItemTit dt{
    display:inline-block !important;
    width:100px;
}
dl.ItemTit dd{
    width:calc(100% - 120px);
    padding-top:10px;
    font-size:1.8rem;
    line-height:1.3;
}
dl.ItemTit dd span{
    display:block;
    font-size:2.4rem;
    font-weight:bold;
    color:#8d4b45;
    line-height:1;
}
.ItemBox dl.ItemTit:nth-child(n + 2) dt {display:none;}
.ProductName{
    padding:6px 1em;
    font-size:2rem;
    font-weight:bold;
    color:#8d4b45;
}
.ProductName + .ItemTit{
    margin-top:40px;
    padding-top:20px;
    border-top:1px dotted #e14944;
}
ul.PointWrap + dl.ItemTit dd {margin-bottom:14px;}


.GiftAttention{
    display:block;
    position:relative;
    top:-10px;
    font-size:1.4rem;
    color:#e14944;
    text-align:center;
}

ul.PointWrap{
    display:flex;
    flex-wrap:wrap;
}
ul.PointWrap li{
    width:318px;
    margin:0 auto 40px;
    text-align:center;
    list-style:none;
}
.PointImg{
    width:80%;
    margin:0 auto;
}
.PointImg img{
    width:100%;
    border:1px solid #8d4b45;
}
.PointTit{
    width:80%;
    margin:0 auto;
    padding:0 8px .4em !important;
    font-size:1.6rem;
    font-weight:bold;
    color:#e14944;
    line-height:1.4;
}
.OnlineLink {padding:0 2em 12px;}
.OnlineLink a{
    display:block;
    background:#e14944;
    width:98%;
    margin:0 auto;
    padding:6px 0;
    font-size:1.4rem;
    font-weight:bold;
    color:#fff;
    text-decoration:none;
    border:2px solid #e14944;
    transition:.3s;
    z-index:2;
}
.OnlineLink a::before{
    font-family:"FontAwesome";
    content:"\f101";
    margin-right:3px;
}
.OnlineLink a:hover{
    background:#fff;
    color:#e14944;
}


/* 小説家になろう */
#ExtraLogo{
    display:flex;
    align-items:center;
    margin-bottom:2em;
}
#ExtraLogo dt{
    width:400px;
}
#ExtraLogo dt img {width:100%;}
#ExtraLogo dd{
    width:calc(100% - 400px);
    font-size:1.5rem;
}
#ExtraTitBox p {margin:0 0 1em 1em;}
.ExtraTit{
    background:#8d4b45;
    margin:0 0 0.4em;
    padding:5px 1em;
    font-size:2rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
}
#ExtraTitBox p b.SubTit{
    margin-top:1em;
    padding:0 0 0.4em;
    font-size:1.8rem;
    color:#8d4b45;
}
#ExtraWrap{
    display:flex;
}
#ExtraLeftBox {width:600px;}
#ExtraLeftBox > div:first-of-type p.ExtraTit {background:#e14944;}
#ExtraLeftBox strong {padding-left:1em;}
#ExtraRightBox{
    width:400px;
    text-align:center;
}
#ExtraRightBox img{
    width:100%;
    max-width:130px;
    margin:0 auto;
}
#ExtraRightBox p{
    width:300px;
    margin-left:80px;
    font-size:1.3rem;
    text-align:left;
}
ul.ExtraList li{
    padding:0 0 1em 20px;
    font-size:1.6rem;
    list-style:none;
}
#ExtraWrap + p{
    margin-left:1em;
    padding-top:1em;
    border-top:1px dashed #8d4b45;
}
#Extra div div {margin-bottom:10px;}
#Extra div div b{
    display:inline-block;
    padding:0 0 1em 1em;
    font-size:1.6rem;
    color:#e14944;
}
#Extra div div a, #ExtraWrap + p a, #Pop p a{
    margin:0;
    padding-bottom:4px;
    font-size:1.6rem;
    font-weight:bold;
    color:#e14944;
    border-bottom:4px double #e14944;
    text-decoration:none;
    transition:0.5s;
}
#Extra div div a::before, #ExtraWrap + p a::before, #Pop p a::before{
	font-family:"Font Awesome 5 Free";
    content:"\f101";
    margin-right:6px;
}
#Extra div div a:hover, #ExtraWrap + p a:hover, #Pop p a:hover {color:#8d4b45;}

#Extra div div a.NoBefore {border-bottom:none;}
#Extra div div a.NoBefore::before{
    content:"";
    margin-right:0;
}

#Extra .ExtraTxt{font-weight: bold;}

.MarL1 {margin-left:1em !important;}
.padL20 {padding-left:20px !important;}
.padL36 {padding-left:36px !important;}


/* Twitterタイムライン */
.wrap500{
    position:relative;
    width:500px;
    margin:0 auto 40px;
    text-align:left;
    line-height:1.7;
}
section.wrap500{
    background:none;
}


/* 注意事項 */
#Attention .SubTit{
    margin-bottom:8px;
    padding:2px 8px;
    font-size:1.6rem;
    font-weight:bold;
    border:2px solid #8d4b45;
    box-sizing:border-box;
}
#Attention li {list-style:none;}
#Attention ul {margin:0 0 2em 1em;}
#Attention ul li p{
    margin-left:-1em;
    text-indent:0;
}
#Attention ul li ul {margin:0 0 1em -1em;}
#Attention li{
    margin-left:1em;
    text-indent:-1em;
}
#Attention .NoMar li{
    margin:0 0 1em 0;
    text-indent:0;
}
.MarTop {margin-top:1em;}
.AttentionSubTit{
    display:block;
    padding-bottom:1em;
    font-size:1.8rem;
}


/* Footer */
footer{
    width:980px;
    margin:30px auto;
}
footer .copyright ul{
    overflow:hidden;
    padding-top:1em;
    border-top:1px dashed #8d4b45;
}
footer .copyright li{
    display:inline-block;
    margin:0 2em 6px 0;
}
#footerGroup #totop{
    width:40px;
    height:40px;
    padding:0;
    text-indent:-9999px;
    background-color:#0079c7;
    border-radius:100%;
    position:fixed;
    bottom:10px;
    right:0;
    z-index:800;
    display:none;
    cursor:pointer;
}
#footerGroup #totop a {display:block;}
#footerGroup #totop::after{
    content:"\f106";
    font-family:"FontAwesome";
    font-size:40px;
    line-height:35px;
    text-indent:0;
    text-align:center;
    color:#fff;
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
}


}


/* スマホ */
@media screen and (max-width: 640px) {
body{
    background:#ffefc1;
    font-size:1.4rem;
    color:#8d4b45;
    text-align:center;
}
.pcOnly {display:none;}


/* header */
header{
    width:100%;
    margin:20px auto 0;
}
header img {width:100%;}


/* 概要 */
section{
    padding:10px;
    border-radius:6px;
    box-sizing:border-box;
}
.wrap1000{
    position:relative;
    width:96%;
    margin:0 auto 40px;
    font-size:1.3rem;
    text-align:left;
    line-height:1.5;
}
.wrap1000 p{
    padding:0 8px 6px;
    line-height:1.5;
}
.wrap1000 p img {width:100%;}
.Tit{
    display:block;
    position:relative;
    background:#e14944;
    height:30px;
    margin-bottom:0.8em;
    padding:0 1em;
    font-size:2rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    line-height:30px !important;
    box-sizing:border-box;
}
.Tit::before, .Tit::after{
    position:absolute;
    content:"";
    width:0;
    height:0;
    z-index:1;
}
.Tit::before{
    top:0;
    left:0;
    border-width:15px 0 15px 15px;
    border-color:transparent transparent transparent #ffefc1;
    border-style:solid;
}
.Tit::after{
    top:0;
    right:0;
    border-width:15px 15px 15px 0;
    border-color:transparent #ffefc1 transparent transparent;
    border-style:solid;
}

#Extra .Tit, #Twice .Tit{
    display:block;
    position:relative;
    background:#e14944;
    height:60px;
    margin-bottom:0.8em;
    padding:7px 1em 0 1em;
    font-size:1.8rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    line-height:23px !important;
    box-sizing:border-box;
}
#Extra .Tit::before, #Twice .Tit::before{
    top:0;
    left:0;
    border-width:30px 0 30px 15px;
    border-color:transparent transparent transparent #ffefc1;
    border-style:solid;
}
#Extra .Tit::after, #Twice .Tit::after{
    top:0;
    right:0;
    border-width:30px 15px 30px 0;
    border-color:transparent #ffefc1 transparent transparent;
    border-style:solid;
}


/* nav */
section#Info.wrap1000 {margin-bottom:28px !important;}
nav.wrap1000{
    margin:20px auto;
    line-height:1;
}
nav ul{
    display:flex;
    flex-wrap:wrap;
    width:96%;
    margin:0 auto;
    padding:20px 0 0;
    border-top:4px double #e14944;
    border-bottom:4px double #e14944;
}
nav li{
    flex-grow:1;
    margin:0 5px;
    font-size:16px;
    font-weight:bold;
    color:#ccc;
}
nav li a{
    display:block;
    padding:0 0 20px;
    color:#e14944;
    text-decoration:none;
}
nav li a::before{
	font-family:"Font Awesome 5 Free";
    content:"\f101";
    margin-right:2px;
}


#AttentionOnlineLink{
    margin:1.6rem 0 -1rem;
    text-align:center;
    font-size:1.5rem;
}


/* 景品 */
#Gift p.Tit + p{
    margin-bottom:1rem;
    font-size:1.6rem;
    text-align:center;
    line-height:1.2;
}
#Gift p.Tit + p:first-line {background:linear-gradient(transparent 60%, #ffff66 60%);}
#Gift p.Tit + p span.FontSmall{
    background:none;
    font-size:1.3rem;
}

.ItemBox{
    background:#fff;
    margin-bottom:30px;
    padding:0 10px 10px;
    border:2px solid #e14944;
    box-sizing:border-box;
}
dl.ItemTit{
    position:relative;
    display:flex;
    align-items:center;
    width:100%;
    min-height:40px;
    margin:0 0 14px;
    color:#e14944;
}
dl.ItemTit dt{
    position:absolute;
    top:8px;
    left:0;
    width:16%;
    vertical-align:top;
}
dl.ItemTit dt img {width:100%;}
dl.ItemTit dd{
    width:calc(84% - 2%);
    margin:0 0 0 18%;
    padding-top:8px;
    font-size:1.6rem;
    line-height:1.2;
}
dl.ItemTit dd span{
    display:inline-block;
    font-size:1.6rem;
    font-weight:bold;
    color:#8d4b45;
}
/*.ItemBox dl.ItemTit:nth-child(n + 2) dt {display:none;}
.ItemBox dl.ItemTit:nth-child(n + 2) dd{
    width:100%;
    padding-top:0.6em !important;
}*/
.ProductName{
    padding:6px 0 !important;
    font-size:1.4rem;
    font-weight:bold;
    color:#8d4b45;
}
.ProductName + .ItemTit{
    margin-top:12px;
    padding-top:12px;
    border-top:1px dotted #e14944;
}
.ProductAttention {padding:0 0 12px !important;}

ul.PointWrap{
}
ul.PointWrap li{
    width:100%;
    margin:0 0 20px;
    text-align:center;
    list-style:none;
}
ul.PointWrap li:last-of-type {margin:0;}
.PointImg{
    width:80%;
    margin:0 auto;
}
.PointImg img{
    width:100%;
    border:1px solid #8d4b45;
}
.PointTit{
    width:80%;
    margin:0 auto;
    padding:0 8px 1rem!important;
    font-size:1.5rem;
    font-weight:bold;
    color:#e14944;
    line-height:1 !important;
}
.OnlineLink {padding:0 2em 12px;}
.OnlineLink a{
    display:block;
    background:#e14944;
    width:84%;
    margin:0 auto;
    padding:6px 0;
    font-size:1.4rem;
    font-weight:bold;
    color:#fff;
    text-decoration:none;
    border:2px solid #e14944;
    z-index:2;
}
.OnlineLink a::before{
    font-family:"FontAwesome";
    content:"\f101";
    margin-right:3px;
}

/*ul.PointWrap + dl.ItemTit{
    margin:30px 0 1em;
    text-align:center;
}*/


/* 小説家になろう */
#Extra p.CenterTxt {text-align:left;}
#ExtraLogo {margin-bottom:2em;}
#ExtraLogo dt{
    width:80%;
    margin:0 auto;
}
#ExtraLogo dt img {width:100%;}
#ExtraLogo dd{
    font-size:1.3rem;
}
.ExtraTit{
    background:#8d4b45;
    margin-bottom:.4em;
    padding:5px 1em !important;
    font-size:1.6rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
}
#ExtraTitBox p b.SubTit{
    margin-top:1em;
    padding:0 0 0.4em;
    font-size:1.5rem;
    color:#8d4b45;
}
.ExtraTit + ul li{
    font-size:1.3rem;
    list-style:none;
}
#Extra div div {margin-bottom:20px;}
#Extra div div b{
    font-size:1.4rem;
    color:#e14944;
}
#Extra div div a{
    margin:0;
    font-size:1.5rem;
    font-weight:bold;
    color:#e14944;
    text-decoration:none;
}
#Extra div div a::before{
	font-family:"Font Awesome 5 Free";
    content:"\f101";
    margin-right:6px;
}
#Extra .Font16{
    display:inline-block;
    margin-top:1em;
    font-size:1.4rem;
}
#ExtraRightBox{
    width:80%;
    margin:0 auto;
    padding-top:10px;
    text-align:center;
    border-top:1px dashed #ccc;
}
#ExtraRightBox img {width:53%;}

ul.ExtraList li{
    font-size:1.3rem;
    list-style:none;
}
#Extra div div b{
    display:inline-block;
    padding:0 0 1em;
    font-size:1.6rem;
    color:#e14944;
}
#Extra div div a, #ExtraWrap + p a, #Pop p a{
    display:inline-block;
    margin:0 0 0.6em !important;
    padding-bottom:2px;
    font-size:1.6rem;
    font-weight:bold;
    color:#e14944;
    border-bottom:4px double #e14944;
    text-decoration:none;
}
#Extra div div a::before, #ExtraWrap + p a:before, #Pop p a:before{
	font-family:"Font Awesome 5 Free";
    content:"\f101";
    margin-right:6px;
}
#Extra div div a.NoBefore {border-bottom:none;}
#Extra div div a.NoBefore::before{
    content:"";
    margin-right:0;
}

/*#Extra div div a:hover, #ExtraWrap + p a:hover {color:#8d4b45;}*/
#Extra #ExtraLeftBox div + div strong {font-size:1.3rem;}
#ExtraLeftBox > div:first-of-type p.ExtraTit {background:#e14944;}

#Extra .ExtraTxt{font-weight: bold;}

.MarL1 {margin-left:1em !important;}
.padL36 {padding:0 0 0 1em !important;}


#Twice.wrap1000 {margin:0 auto;}

/* Twitterタイムライン */
.wrap500{
    position:relative;
    width:90%;
    margin:0 auto 40px;
    text-align:left;
    line-height:1.7;
}
section.wrap500 {background:none;}


/* 注意事項 */
#Attention .SubTit{
    margin-bottom:8px;
    padding:2px 8px;
    font-size:1.5rem;
    font-weight:bold;
    text-align:center;
    border:2px solid #8d4b45;
    box-sizing:border-box;
}
#Attention li {list-style:none;}
#Attention ul {margin:0 0 2em;}
/*#BookfairAttention + ul + p + ul li:first-of-type{
    margin:0;
    text-indent:0;
}*/
#Attention li{
    margin-left:1em;
    text-indent:-1em;
}
#Attention .NoMar li, #Attention .NoMar{
    margin:0 0 1em 0;
    text-indent:0;
}
.MarTop {margin-top:1em;}
#Attention li p {padding-left:0;}


/* Footer */
footer{
    width:94%;
    margin:20px auto;
}
footer .copyright ul{
    overflow:hidden;
    padding-top:1em;
    border-top:1px dashed #8d4b45;
}
footer .copyright li{
    display:inline-block;
    margin:0 1em 6px;
    font-size:1.1rem;
    line-height:1.4;
}
#footerGroup #totop{
    width:40px;
    height:40px;
    padding:0;
    text-indent:-9999px;
    background-color:#0079c7;
    border-radius:100%;
    position:fixed;
    bottom:10px;
    right:0;
    z-index:800;
    display:none;
    cursor:pointer;
}
#footerGroup #totop a {display:block;}
#footerGroup #totop::after{
    content:"\f106";
    font-family:"FontAwesome";
    font-size:40px;
    line-height:35px;
    text-indent:0;
    text-align:center;
    color:#fff;
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
}
}