@charset "UTF-8";

/* =======================================================================

CSSの名前：kadokawa＿hagaki.css KADOKAWAはがき素材

/ext/kadokawa＿hagaki.xhtml

--------------------------------------------------------------------------*/
#couponBox {width:950px; margin:70px auto 50px;padding:20px 50px;border:3px solid #0067be;background: #eef8ff;text-align: center;}
#couponBox #couponTtl{font-size: 3.0em;font-weight: bold;color:#004f91;}
#couponBox #couponBnr{background: url("../images/detail/kadokawa_hagaki/coupon20260108.png")no-repeat;width:835px;height: 190px;margin: 0 auto;padding-top: 131px;}
#couponBox #couponCode{width:320px;height: 40px;margin: 0 0 0 320px;;font-size: 2.4em;font-weight: bold;text-align: center;color:#072dbb;padding: 0 0 0 0;}
#couponBox  p{font-size:1.5em;}

#jstore {clear:both;width:100%!important;margin:0 auto 0;padding-bottom:0;background: #f1f4f8;}
#jstore .red {color: #c80010;}
#jstore .small{font-size:75%;}
#jstore a:hover{text-decoration: none;}
#jstore p{font-size: 1.6em;line-height: 1.8em;color:#333;}
#jstore p+p{margin-top:5px;}
#jstore .topTxt{font-size:20px;margin: 20px 0;}
#kadokawaTOP{background: url( "../images/detail/kadokawa_hagaki/bg_ttl2026.png")repeat-x;text-align: center;}

#mnBox{background: #fff; width:1055px;margin:30px auto 70px!important;padding: 30px 0!important; border:3px solid #BBB;overflow: hidden;}
#mnBox ul{clear: both; width:1000px;margin:0 auto 0;}
#mnBox ul li{position: relative;float:left;width:311px;color:#FFF;background: #d44e26;margin:10px 11px 0;padding: 20px 0; font-size:1.8em;font-weight: bold;text-align: center;border-radius: 8px;}
#mnBox ul li:after { position: absolute; content: "\f078"; font-family: 'Font Awesome 5 Free';font-weight: 900;right: 15px;}
#mnBox ul li.etc{background: #2c5490;}
#mnBox ul a:hover li{background: #e56e4b;}
#mnBox ul a:hover li.etc{background: #5a88cc;}

/* #mnBox ul li{position: relative;float:left;width:230px;color:#FFF;background: #d44e26;margin:10px 10px 0;padding: 20px 0; font-size:1.8em;font-weight: bold;text-align: center;border-radius: 8px;}--*/

#tmpArea{clear:both;background: #fff;overflow:auto;padding-bottom: 100px!important; }

#tmpArea h2 {position: relative; display: block; padding: 20px 55px!important;width:1055px!important;margin:60px auto 30px!important;text-align: center;color:#fff;font-size: 4.6em;letter-spacing: 0.5em;}
#tmpArea h2:before, #tmpArea h2:after { content: '';  position: absolute; top: 50%; display: inline-block;width: 300px; height: 1px;  background-color: #fff;}
#tmpArea h2:before { left:50px;}
#tmpArea h2:after { right:50px;}
#tmpArea h2 img{vertical-align:-30px;margin: 0 10px 0 0;}
#tmpArea #nengaCol h2{background-color: #d44e26;}
#tmpArea #etcCol h2{background-color: #2c5490;}

#tmpArea h3{clear: both; margin-top: 50px; font-size: 3.8em;letter-spacing: 0.5em;text-align: center;}
#tmpArea h3 span{display: inline-block; border-style:solid;border-width: 1px; font-size:50%;letter-spacing:normal;line-height: 1.0;margin: 0 20px 0 0;padding:9px 20px 5px;vertical-align: middle;}
#tmpArea #nengaCol h3{color:#d44e26;border-color: #d44e26;}
#tmpArea #etcCol h3{color:#2c5490;border-color: #2c5490;}

ul#tmpList {text-align: center ;width:1030px;box-sizing: border-box;margin: 20px auto 30px!important;background: #f8f8f8;padding:15px;overflow: hidden;z-index:1;}
ul#tmpList li {display: block; float: left; width:250px;margin:0 auto;padding:15px 10px 10px;background: #f2f2f2;border:1px solid #DDD;}
ul#tmpList li .imgTPL {height:200px!important;vertical-align: middle;}
ul#tmpList  li img{width:185px;height:185px;}
ul#tmpList  li .imgTPL:hover{opacity: 0.5;background:url("../images/detail/kadokawa_hagaki/zoom.png")no-repeat right top;z-index: 10;}

#tmpList .btnBuy{ position: relative;margin:10px auto 10px;text-align: center;background: #434343;color:#FFF;width:190px;font-size:1.6em;font-weight: bold; padding:8px 0 4px!important;border-radius: 30px;border:2px solid #c80010;}
#tmpList a .btnMBuy span{font-size: 110%;font-weight: bold;margin:0 5px;}
#tmpList a .btnBuy{background: #c80010;}
#tmpList a:hover .btnBuy{background: #fff;color: #c80010;}
#tmpList .btnBuy:after { position: absolute; content: "\f054"; font-family: 'Font Awesome 5 Free';font-weight: 900;   right: 15px;}