@charset "UTF-8";

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

CSSの名前：welcome_guide.css はじめての購入ガイド

/ext/welcome_guide/*******.xhtml

--------------------------------------------------------------------------*/
#fgwstore #main3 {clear:both;width:100%!important;margin:0 auto 0;padding-bottom:0;}
#fgwstore #main3 .inner{clear:both;width:100%!important;background: #f1f4f8;padding:50px 0;}
#fgwstore .red {color: #c80010;}
#fgwstore .small{font-size:75%;}
#fgwstore a:hover{text-decoration: none;}
#fgwstore #main3 #breadcrumbsline{width:1095px;margin:0 auto;}

#fgwstore p{font-size: 1.6em;line-height: 1.8em;color:#333;}
#fgwstore p+p{margin-top:5px;}

#fgwstore .textArea{margin: 30px;}

#wGuide{width:1055px;margin: 0 auto 120px!important;box-sizing: border-box;}
#wGuide-W{width:1095px;margin: 0 auto 50px!important;}
#sMenu{width:230px;float: left;}
#guideMain{width:840px;float: right;}
#guideMain img{vertical-align: bottom!important;}

/*---Topページ------------------------------------------------------------------*/
#wGuide #meritBox a{color:#0b5ac6;text-decoration: underline;}
#wGuide #meritBox a:hover{text-decoration: underline;}

#meritBox{width:1005px;text-align:center;margin:20px auto 50px!important;background: #f3f3f3;border-radius: 8px;padding:0 20px 20px!important;}
#meritBox h2{position: relative;text-align: center;font-size:3.0em;clear:both;line-height:2.4em;margin:0 20px!important;color:#ca3a66;}
#meritBox h2 span{position: relative;z-index: 2;display: inline-block;margin: 0 5em;text-align: left;background: #f3f3f3;padding:10px 20px 0 30px;height:60px;}
#meritBox h2::before {position: absolute;top: 50%;z-index: 1;content: '';display: block;width: 100%;height: 1px;background-color: #ca3a66;}
#meritBox a:hover img{opacity: 1.0;}

#wGuide dl.topMenuBox {border:2px solid #3c996a;width:1055px;margin:0 auto 50px;display: flex;height:190px;box-sizing: border-box;}
#wGuide dl.topMenuBox dt{background: #3c996a;width: 265px;padding: 20px!important;text-align: center;}
#wGuide dl.topMenuBox dt h3{color:#FFF;font-size: 3.0em;font-weight: normal;margin-top: 10px!important;}
#wGuide dl.topMenuBox dt img{margin-top: 10px;}
#wGuide dl.topMenuBox dd{padding: 20px!important;width: 780px;}

#wGuide dl.topMenuBox dd .txtDetails{font-size: 1.8em;height:100px;}
#wGuide dl.topMenuBox dd .btnDetails{display: block; margin:0 auto 10px;text-align: center;background: #434343;color:#FFF;width:300px;font-size:1.9em;padding:11px 0 9px!important;border-radius: 30px;float:right;}
#wGuide dl.topMenuBox dd a .btnDetails span{font-size: 110%;margin:0 5px;}
#wGuide dl.topMenuBox dd a .btnDetails{background: #c80010;}
#wGuide dl.topMenuBox dd a:hover .btnDetails{background: #fc5f5f;}


/*---SideMenu------------------------------------------------------------------*/

#sideMenuBox{width:230px;border:1px solid #CCC;padding:2px!important;box-sizing: border-box;}
#sideMenuBox h2{background:#3c996a!important;color:#fff;font-size:17px;padding:6px 4px 6px 8px;font-weight: normal;}
#sideMenuBox h2 img{vertical-align: middle;margin-right: 10px;}
#sideMenuBox h3{display: block; background:#d4ead4!important;color:#0b5ac6;font-size:15px;padding:8px 4px 8px 15px;margin-bottom: 2px;font-weight: normal;}
#sideMenuBox ul{width:200px;margin:0 auto;}
#sideMenuBox ul li{display: block; padding:8px 4px 8px 40px;border-bottom:1px solid #d4ead4;font-size:14px;}
#sideMenuBox ul li:last-child{border-bottom: none;}
#sideMenuBox a:hover{text-decoration: underline;}


/*-------------------------------------------------------------------------------
-------下層ページ------------------------------------------------------------------*/

#guideMain #ttl{background-color:#3c996a!important;padding:25px 30px 20px;color:#fff;font-size:1.8em;margin-bottom: 20px;}

#guideMain #ttl .ttlR{width:100px;}
#guideMain #ttl .ttlL{width:730px;}
#guideMain #ttl h1{font-size:38px;font-weight: normal;}

#guideMain .capBox{width:840px;border:10px solid #dfdfdf;background: #f1f4f8;text-align: center;}
#guideMain .capBox h2{font-size:2.8em;font-weight: normal;margin: 20px 0 5px;color:#2d915e;}
#guideMain .capBox h2 span{font-size:19px;margin: 20px 0;background:#2d915e;color:#fff;border-radius: 8px;padding:4px 10px 2px;margin: 0 15px 0 0!important;}
#guideMain .capBox img{margin-top: 10px;}
#guideMain .flowTriangle{margin:30px auto; width: 0; height: 0; border-left: 70px solid transparent; border-right: 70px solid transparent; border-top: 40px solid #c80010;}


/*---item.xhtml------------------------------------------------------------------*/
#guideMain .Twrap{width:840px!important;box-sizing:border-box;background: #f7f7f7; padding:6px 0 6px 5px;border-radius: 0;text-align: left;}
#guideMain .Twrap td:nth-child(4){border-right: 1px solid #f7f7f7;}
#guideMain .Twrap td{border-right: 1px dotted #ddd;width:220px;display: table-cell;vertical-align: top;}
#guideMain .Twrap td.txt{font-size:15px;text-align: left;padding:15px 20px;}

#guideMain .Twrap th{width:170px;text-align: center;}
#guideMain .Twrap table{margin:0;}
#guideMain .Twrap .itemName{background: #c80010;color:#fff;border-bottom:none;border-right: 1px dotted #ddd;}

#fgwstore .Twrap a:hover{text-decoration: none!important;}
#fgwstore .Twrap .small{font-size: 80%;}

#fgwstore .Twrap .btnBuyS{width:200px;color:#FFF;font-size:16px;border-radius: 30px;text-align: center;box-sizing: border-box;margin:5px auto; padding:6px 0 5px 0!important;}
#fgwstore .Twrap a:hover .btnBuyS{background: #FFF;text-decoration: none;}

#fgwstore .Twrap .Pkg{background: #040ab7;border:2px solid #040ab7;}
#fgwstore .Twrap a:hover .Pkg{border:2px solid #040ab7;color: #040ab7;}
#fgwstore .Twrap .Dl{background: #c2405c;border:2px solid #c2405c;}
#fgwstore .Twrap a:hover .Dl{border:2px solid #c2405c;color: #c2405c;}
#fgwstore .Twrap .Eco{background: #2c8300;border:2px solid #2c8300;}
#fgwstore .Twrap a:hover .Eco{border:2px solid #02c8300;color: #2c8300;}


/*---delivery.xhtml------------------------------------------------------------------*/
#deliveryBox h2{position: relative; padding: .35em 1em .35em 1.5em; border: 1px solid #3c996a;margin: 0 20px;border-radius: 8px;font-size:20px;color:#3c996a;background: #deefde;font-weight: normal;}
#deliveryBox h2::after {position: absolute;top: .5em;left: .5em; content: ''; width: 6px; height: -webkit-calc(100% - 1em); height: calc(100% - 1em); background-color: #3c996a; border-radius: 4px;}
#deliveryBox .textArea{margin-bottom: 100px;}


/*---ページャー------------------------------------------------------------------*/
#guidePager{font-size:1.8em;display: flex;margin: 50px 0 80px!important;}
#guidePager .pagerL{width:300px;border:3px solid #d4ead4;padding:20px 10px;text-align: left;color:#1e8752;}
#guidePager .pagerR{width:300px;border:3px solid #d4ead4;padding:20px 10px;text-align: right;color:#1e8752;}
#guidePager .pagerT{width:240px;background:#3c996a;padding:10px 0 0;text-align: center;color: #fff;}
#guidePager .pagerT a{color: #fff;}
#guidePager .pagerR a,#guidePager .pagerL a{color:#1e8752;}
#guidePager a:hover{text-decoration: underline;}
