@charset "UTF-8";
/* CSS Document */

/*************************************************************************************************************************
* reset
*************************************************************************************************************************/
html{ height:100%; }
body{ height:100%; margin:0; padding:0; overflow-x: hidden; font-family: "Noto Sans JP", "Droid Sans", Helvetica, YuGothic, "Yu Gothic", 游ゴシック体, 游ゴシック, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", Arial, sans-serif; word-break:break-all; -webkit-text-size-adjust:100%; }
img{ width:100%; max-width:100%; height:auto; border:0; font-size:0; line-height:0; vertical-align:bottom; }
form{ margin:0; padding:0; }
p{ margin:0; padding:0; }
a, a:hover{ text-decoration:none; outline:none; }
h1, h2, h3, h4, h5, h6{ margin:0; padding:0; font-weight: normal; }
ul, dl, dt, dd{ margin:0; padding:0; }
li, ol{ margin:0; padding:0; list-style:none; }
table{ border:0; border-collapse:collapse; border-spacing:0; }
caption, th{ text-align:left; }
.clear{ clear:both; margin:0; padding:0; font-size:0; line-height:0; }
sup{ font-size:60%; }
header, nav, article, aside, section, footer{ display:block; }

input[type=text],
input[type=submit],
input[type=button],
select,
textarea{ border:#bdbdbd 1px solid; -webkit-appearance: none; -moz-appearance:none; appearance: none; outline: none; }

input[type=checkbox]{ cursor: pointer;}
disabled{ cursor: inherit; }
label{ cursor: text;}
*{ box-sizing:border-box; }

/*************************************************************************************************************************
* デフォルト：640px以下用の記述
*************************************************************************************************************************/
body{ font-size: 14px; color: #333; line-height: 1.65;}
br.tbpc,
br.pc{ display: none;}

a{ color: #333;}
.bold{ font-weight: bold;}
.normal{ font-weight: normal!important;}

.db{ display: block!important;}
.dinb{ display: inline-block;}
.dt{ display: table; margin:0 auto;}
.di{ display: inline;}

.sptbNone{ display: none;}
.dn340{ display: inline-block;}
@media print, screen and (max-width:340px) { .dn340{ display: none;} }

.mt00{ margin-top:0!important;}
.mt01{ margin-top:1px!important;}
.mt02{ margin-top:2px!important;}
.mt03{ margin-top:3px;}
.mt05{ margin-top:5px;}
.mt08{ margin-top:8px;}
.mt10{ margin-top:10px;}
.mt15{ margin-top:15px!important;}
.mt20{ margin-top:20px!important;}
.mt25{ margin-top:25px;}
.mt30{ margin-top:30px!important;}
.mt35{ margin-top:35px!important;}
.mt40{ margin-top:40px!important;}
.mt45{ margin-top:45px!important;}
.mt50{ margin-top:50px!important;}
.mt55{ margin-top:55px!important;}
.mt60{ margin-top:60px!important;}
.mt80{ margin-top:80px!important;}

.mt-10{ margin-top:-10px!important;}
.mt-40{ margin-top:-40px;}
.mt-50{ margin-top:-50px;}

.mb00{ margin-bottom:0!important;}
.mb03{ margin-bottom:3px!important;}
.mb05{ margin-bottom:5px!important;}
.mb10{ margin-bottom:10px!important;}
.mb15{ margin-bottom:15px!important;}
.mb20{ margin-bottom:20px!important;}
.mb25{ margin-bottom:25px!important;}
.mb30{ margin-bottom:30px!important;}
.mb40{ margin-bottom:40px!important;}
.mb50{ margin-bottom:50px!important;}
.mb-10{ margin-bottom:-10px!important;}

.ml00{ margin-left:0!important;}
.ml05{ margin-left:5px;}
.ml10{ margin-left:10px;}
.ml15{ margin-left:15px;}
.ml20{ margin-left:20px;}
.ml25{ margin-left:25px;}
.ml30{ margin-left:30px;}
.ml75{ margin-left:75px;}
.ml-05{ margin-left:-5px;}

.pt00{ padding-top:0!important;}
.pt05{ padding-top:5px;}
.pt10{ padding-top:10px!important;}
.pt15{ padding-top:15px!important;}
.pt20{ padding-top:20px!important;}
.pt25{ padding-top:25px;}
.pt30{ padding-top:30px!important;}
.pt35{ padding-top:35px;}
.pt40{ padding-top:40px!important;}
.pt45{ padding-top:45px!important;}
.pt50{ padding-top:50px!important;}
.pt55{ padding-top:55px!important;}
.pt60{ padding-top:60px!important;}

.pb00{ padding-bottom:0!important;}
.pb10{ padding-bottom:10px!important;}
.pb15{ padding-bottom:15px!important;}
.pb20{ padding-bottom:20px!important;}
.pb30{ padding-bottom:30px!important;}
.pb40{ padding-bottom:40px!important;}
.pb50{ padding-bottom:50px!important;}
.pb55{ padding-bottom:55px!important;}
.pb60{ padding-bottom:60px!important;}
.pb65{ padding-bottom:65px!important;}
.pb70{ padding-bottom:70px!important;}
.pb80{ padding-bottom:80px!important;}
.pb110{ padding-bottom:110px!important;}

.pl00{ padding-left:0px!important;}
.pl05{ padding-left:5px!important;}
.pl10{ padding-left:10px!important;}
.pl15{ padding-left:15px!important;}
.pl20{ padding-left:20px!important;}
.pl45{ padding-left:45px!important;}

.pr00{ padding-right:0px!important;}
.pr05{ padding-right:5px!important;}
.pr10{ padding-right:10px!important;}

.font09{ font-size: 9px!important;}
.font10{ font-size: 10px!important;}
.font11{ font-size: 11px!important;}
.font12{ font-size: 12px!important;}
.font13{ font-size: 13px!important;}
.font14{ font-size: 14px!important;}
.font15{ font-size: 15px!important;}
.font16{ font-size: 16px!important;}
.font17{ font-size: 17px!important;}
.font18{ font-size: 18px!important;}
.font20{ font-size: 20px!important;}
.font22{ font-size: 22px!important;}
.font24{ font-size: 24px!important;}
.font26{ font-size: 26px!important;}
.font27{ font-size: 27px!important;}
.font28{ font-size: 28px!important;}
.font30{ font-size: 30px!important;}
.font32{ font-size: 32px!important;}
.font36{ font-size: 36px!important;}
.font39{ font-size: 39px!important;}
.font48{ font-size: 48px!important;}

/*bg*/
.bgNone{ background: none!important;}
.bgWhite{ background: #fff;}
.bgGray{ background: #f7f7f7;}

/*txt*/
.noto{ font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif; }
.white{ color: #fff!important;}
.gray{ color: #737373;}
.gray02{ color: #888;}
.red{ color: #f00000;}
.blue{ color: #008fe1!important;}
.navy{ color: #001239;}
.yellow{ color: #eef050;}
.black{ color: #333;}

.letter-1{ letter-spacing: -1px;}
.letter00{ letter-spacing: 0!important;}
.letter01{ letter-spacing: 1px;}
.letter02{ letter-spacing: 2px;}

.decoNone{ text-decoration: none!important;}
.txtdeco{ text-decoration: underline;}

.w7per{ width: 7%;}
.w8per{ width: 8%;}
.w10per{ width: 10%;}
.w11per{ width: 11%;}
.w12per{ width: 12%;}
.w14per{ width: 14%;}
.w16per{ width: 16%;}
.w17per{ width: 17%;}
.w18per{ width: 18%;}
.w19per{ width: 19%!important;}
.w20per{ width: 20%;}
.w21per{ width: 21%;}
.w22per{ width: 22%;}
.w24per{ width: 24%!important;}
.w25per{ width: 25%!important;}
.w26per{ width: 26%!important;}
.w28per{ width: 28%;}
.w30per{ width: 30%!important;}
.w31per{ width: 31%!important;}
.w32per{ width: 32%!important;}
.w34per{ width: 34%!important;}
.w35per{ width: 35%!important;}
.w36per{ width: 36%!important;}
.w37per{ width: 37%!important;}
.w38per{ width: 38%!important;}
.w50per{ width: 50%;}

.w180{ width: 180px!important;}
.w220{ width: 220px;}
.w250{ width: 250px;}
.w260{ width: 260px;}
.w290{ width: 290px;}
.w300{ width: 300px;}

.center{ text-align: center!important;}
.left{ text-align: left;}
.right{ text-align: right;}

.lih1{ line-height: 1!important;}
.lih12{ line-height: 1.2!important;}
.lih14{ line-height: 1.4!important;}
.lih15{ line-height: 1.5!important;}
.lih16{ line-height: 1.6!important;}
.lih18{ line-height: 1.8;}
.lih18{ line-height: 1.85!important;}

.op06{ opacity:0.6;}
.op04{ opacity:0.4;}
.vtop{ vertical-align: top;}

/*still*/
.still{ display: inline-block; background: #008fe1; padding:4px; margin:0 0 0 6px; font-size: 9px; color: #fff; line-height: 1; vertical-align: top; border-radius: 2px;}
.hdScr .still{ background: #fff; color: #008fe1; }


/* pickup
**********************************************************************/
#pickup.normal{ background: #003a5c; }
#pickup.normal div{ padding:14px 30px 12px 10px; }
#pickup.normal dl{ padding:0 0 0 60px; }
#pickup.normal dl dt{ background: #05d9d2; padding:6px; top: 0; font-size: 10px; color: #003a5c; border-radius: 2px;}


/* header
**********************************************************************/
header{ background: #008FE1; width: 100%; position: relative; z-index: 10000;}
header.sp_on{ z-index: 1000000000;}
header > div{ width: 100%; height: 40px; transition: background 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 10000;}
header .logo{ background: url("../img/hd_logo.png")no-repeat; background-size: contain; width: 150px; height: 30px; position: absolute; top: 4px; left: 10px;}

/*spBtn*/
header .spBtn{ height: 40px; padding:10px 15px 0; text-align: right;}
header .openBtn{ background: url("../img/hd_openBtn.png")no-repeat center; background-size: 15px auto; position: absolute; top: 0; right: 0; }
header .closeBtn{ background: #fff;}
header .spBtn a{ display: inline-block; width: 15px;}
header .spBtn a img{ display: block;}

/**hdScr**/
.hdScr > div{ background: #fff; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); }
.hdScr .logo{ background: url("../img/hd_logo_01.png")no-repeat; background-size: contain;}
.hdScr .openBtn{ background: url("../img/hd_openBtn02.png")no-repeat center; background-size: 15px auto;}

/*bg*/
header .bg{ display: none; background: rgba(0,10,16,0.8);; width: 100%; height: 100%; position: fixed; top: 0; left: 0;}

/*menuBox*/
.menuBox{ background: #f5f5f5; width: 84%; max-width: 360px; height: 100%; overflow-y: scroll; position: fixed; top: 0; right: -360px; }
.menuBox .main{ border-top: #e8e8e8 1px solid;}
.menuBox .main > li{ border-bottom: #e8e8e8 1px solid;}

.menuBox .main > li > a,
.menuBox .main > li .open a,
.menuBox .main .innerMenu li a{ display: block; min-height: 46px; }
.menuBox .main > li > a,
.menuBox .main > li .open a{ background: #fff; padding:12px 15px 10px;}

.menuBox .main > li .open{ position: relative;}
.menuBox .main > li .open span{ display: block; background: url("../img/hd_nav01.png") no-repeat center ,#f5f5f5; background-size: 12px; width: 46px; height: 100%; position: absolute; top: 0; right: 0; cursor: pointer;}
.menuBox .main > li .open span.on{ background: url("../img/hd_nav02.png") no-repeat center ,#f5f5f5; background-size: 12px;}
.menuBox .main li a{ font-size: 13px;}

/*innerMenu*/
.menuBox .main .innerMenu{ height: 0; overflow: hidden; }
.menuBox .main .innerMenu li{ border-top: #fff 1px solid; }
.menuBox .main .innerMenu li:first-child{ border-top: none;}
.menuBox .main .innerMenu li a{ padding:12px 15px 10px 25px;}
.menuBox .main .innerMenu li > span{ display: none;}

/*other*/
.menuBox .other{ padding:30px 20px 60px;}
.menuBox .other .menu > li a{ display: block;}
.menuBox .other .menu li a{ background: #fff; min-height: 46px; padding:12px 12px 10px; }
.menuBox .other .menu li:first-child a{ margin:0 0 10px; }

.menuBox .other .btnBox{ margin-top: 30px;}
.menuBox .other .btnBox .btn{ display: block; min-height: 44px; margin:10px 0 0; font-size: 13px; font-weight: bold; text-align: center; border-radius: 4px;}
.menuBox .other .btnBox .login a{ border: #333 1px solid;}
.menuBox .other .btnBox .signup a{ background: #008fe1; color: #fff;}

.menuBox .other .sns{ margin:26px 0 0;}
.menuBox .other .sns p{ margin:0 0 6px; text-align: center; }
.menuBox .other .sns ul{ overflow: hidden;}
.menuBox .other .sns ul li{ width: 24px; margin:0 0 0 8px; float: left;}
.menuBox .other .sns ul li:first-child{ margin:0;}
.menuBox .other .closeTxt{ margin:36px 0 0; text-align: center;}
.menuBox .other .closeTxt a{ background: url("../img/hd_closeBtn02.png") no-repeat left center; background-size: 8px; padding:0 0 0 16px; font-size: 11px; color: #8a8a8a; letter-spacing: 2px;}

/*livechat*/
.menuBox .other .menu .live a img,
.menuBox .other .menu .live a span{ display: none;}
.menuBox .other .menu .live a{ line-height: 1.5; }
.menuBox .other .menu .live a:before,
.menuBox .other .menu .live a:after{ display: inline-block;  }
.menuBox .other .menu .live a:after{ content: "（ 平日 9:30-12:00 / 13:00-17:30 ）"; font-size: 11px;}

.lhc-status-native-online a:before{ content: "ライブチャット受付中"; }
.lhc-status-native-offline a:before{ content: "ライブチャット時間外"; }
#lhc_container.lhc-min .status-icon{ display: none!important; padding: 6px!important;}

/*side*/
header .side{ display: none; position: absolute; top: 60px; right: 0; }
header .side a{ display: block; background: #1bc5de; overflow: hidden; color: #fff; text-align: center; border-radius: 4px 0 0 4px; }
header .side a span{ display: block;}
header .side a .txt{ background: url("../img/hd_side01.png") no-repeat center 9px; background-size: 42px; width: 62px; height: 212px; padding:56px 18px 0; font-size: 15px; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl;}
header .side a .topic{ background: #03a6be; font-size: 10px; letter-spacing: -1px; }

header .paypal{ display: none; background: #fff; width: 130px; position: fixed; bottom: 250px; right: 0;}
header .paypal .close{ position: absolute; top: 5px; right: 5px; color: #fff;}


/* adult */
header .adult-btn{ display: inline-block; padding-left: 10px!important; margin-top: -1px; font-size: 10px; color: white; line-height: 1.1; text-align: center; border-left: white 1px solid; transition: color 0.3s ease-in-out 0s; }
header .adult-btn:hover{ color: #FF5773!important; }
header.on .adult-btn{ color: white!important; border-color: white!important;}
.hdScr .adult-btn{ color: #333!important; border-color: #333!important;}
@media print, screen and (max-width:1040px){
	header .adult-btn{ padding-left: 4px!important; margin-left: -4px; letter-spacing: -1px!important; }
}
@media print, screen and (max-width:980px){
	header .adult-btn{ display: none; }
}


/* pagetop
**********************************************************************/
.pagetop{ display: none; position: fixed; right: 10px; bottom: 56px; z-index: 100;}
.pagetop a img{ width: 38px; }

/*fix_main_btn*/
.fix_main_btn{ background: rgba(0, 0, 0, 0.30); width: 100%; padding: 20px; position: fixed; left: 0; bottom: 0; z-index: 1000; transform: translateY(100%); transition: transform 0.3s ease-in-out 0s; }
.fix_main_btn ul{ display: flex; justify-content: space-between; max-width: 780px; margin: 0 auto;}
.fix_main_btn li{ width: 47%; max-width: 370px; }
.fix_main_btn li a{ display: block; height: 60px; font-size: 18px; font-weight: bold; line-height: 58px; text-align: center; border-radius: 30px; transition: background 0.3s ease-in-out 0s;}
.fix_main_btn li span{ display: table; padding-left: 36px; margin: 0 auto;}
.fix_main_btn .btn-cart a{ background: #FBB500; color: white; border: #FBB500 1px solid;}
.fix_main_btn .btn-cart a:hover{ background: #FFBD12;}
.fix_main_btn .btn-cart span{ background: url("../img/fix_main_btn_icon01.png") no-repeat left center /20px auto;}
.fix_main_btn .btn-plan a{ background: white; color: #5C5C5C; border: #5C5C5C 1px solid;}
.fix_main_btn .btn-plan a:hover{ background: #F6F6F6; }
.fix_main_btn .btn-plan span{ background: url("../img/fix_main_btn_icon02.png") no-repeat left center /20px auto;}

@media print, screen and (max-width:980px){
	.fix_main_btn{ padding: 16px 10px;  z-index: 100000000;}
	.fix_main_btn li{ width: 49%;}
	.fix_main_btn li a{ font-size: 16px;}
	.fix_main_btn li span{ padding-left: 26px;}
}
@media print, screen and (max-width:500px){
	.fix_main_btn li a{ font-size: 14px;}
}

/* contact fix */
.contactFix{ display: none; background-image: -moz-linear-gradient( 0deg, rgb(36,160,227) 0%, rgb(1,89,188) 100%); background-image: -webkit-linear-gradient( 0deg, rgb(36,160,227) 0%, rgb(1,89,188) 100%); background-image: -ms-linear-gradient( 0deg, rgb(36,160,227) 0%, rgb(1,89,188) 100%); padding:18px 20px 14px 24px; position: fixed; bottom: 0; right: 30px; border-radius: 4px 4px 0 0; z-index: 100; box-shadow:0 0 12px 1px rgba(0,0,0,0.3);}
.contactFix:before{ content: ""; display: block; background: url("../img/contactFix_img.png")no-repeat; background-size: cover; width: 120px; height: 36px; position: absolute; top: -44px; right: 0;  z-index: 1000;}

.contactFix dl{ overflow: hidden; color: #fff; }
.contactFix dt,
.contactFix dd{ float: left;}
.contactFix dt{ padding:0 12px 0 0; margin:0 14px 0 0; font-size: 15px; border-right: #3799ed 1px solid; }
.contactFix dd{ margin:1px 0 0; overflow: hidden; font-size: 13px; letter-spacing: 1px;}

.contactFix dd a,
.contactFix dd .live,
.contactFix dd .border{ float: left;}
.contactFix dd a{ color: #fff;}
.contactFix dd .border{ margin:0 6px;}

.contactFix > p{ font-size: 11px; position: absolute; right: 0; top: -44px;}
.contactFix .live a img,
.contactFix .live span{ display: none;}

.contactFix .live a:before{ display: inline-block; text-decoration: underline; }
.contactFix .live .lhc-status-native-online a:before,
.contactFix .live .lhc-status-native-offline a:before{ content: "チャット"; }
.contactFix .live .lhc-status-native-offline a:before{ text-decoration: none; color: #4e95dc;}


/* footer
**********************************************************************/
footer > p{ background: #203b54; padding:14px 10px 12px; font-size: 12px; color: #c0cad4;}
footer > p span{ display: block; max-width: 1200px; margin:0 auto; }
footer > div{ background: #1e3143; padding:30px 10px 30px;}

/*ftTop*/
.ftTop,
.ftBtm{ max-width: 1200px; margin:0 auto;}
.ftTop .logo img{ width: 152px; }
.ftTop .main > li > a,
.ftTop .main > li > p{ display: inline-block; margin:32px 0 4px; font-size: 13px; font-weight: bold; color: #fff;}

.ftTop .innerMenu li{ margin:4px 0 0;}
.ftTop .innerMenu li a{ font-size: 12px; color: #c0cad4;}
.ftTop .innerMenu li a:before{ right: -16px;}

.ftTop .sns{ overflow: hidden;}
.ftTop .sns li{ float: left;}
.ftTop .sns li:nth-child(2){ margin:4px 10px 0;}
.ftTop .sns li img{ width: 22px;}

/*ftBtm*/
.ftBtm{ margin:30px 0 0; padding:24px 0 0; border-top: #3b4d5e 1px solid;}
.ftBtm ul li{ margin:2px 0 0; }
.ftBtm ul li a{ font-size: 12px; color: #8996a2;}
.ftBtm > p{ margin:26px 0 0; font-size: 11px; color: #8996a2; text-align: center;}


/* content
**********************************************************************/
.wrap{ max-width: 1200px; padding:50px 0; margin:0 auto;}


/* btn
**********************************************************************/
.btn{ display: table; padding:11px 36px 10px; text-align: center; border-radius: 4px;}
.btn.blueBorder,
.btn.whiteBorder{ margin:30px auto 0;}
.btn.blueBorder{ font-weight: bold; color: #008fe1; border:#008fe1 2px solid; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);}
.btn.whiteBorder{ color: #fff!important; border:#fff 2px solid!important; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);}

.blueBtn{ background: #008fe1; color: #fff; }
.none{ border: #cecdcd 2px solid!important; color: #cecdcd!important; }

.newsBtn{ display: block; background: url("../img/icon_newsBtn.png") no-repeat left 2px; background-size: 13px auto; padding:0 0 0 20px; font-size: 11px; color: #888; line-height: 1; }
.newsBtn span{ text-decoration: underline;}

.detailBtn{ text-align: right;}
.detailBtn .newsBtn{ display: inline-block;}
.txtLink{ text-decoration: underline;}

.blank,
.blank02,
.blank03,
.blank04{ position: relative;}
.blank:before,
.blank02:before,
.blank03:before,
.blank04:before{ content: ""; display: block; width: 10px; height: 9px; position: absolute; top: 6px; right: 0; }

.blank:before{ background: url("../img/icon_blank02.png") no-repeat; background-size: contain;}
.blank02:before{ background: url("../img/icon_blank01.png") no-repeat; background-size: contain;}
.blank03:before{ background: url("../img/icon_blank03.png") no-repeat; background-size: contain;}
.blank04:before{ background: url("../img/icon_blank04.png") no-repeat; background-size: contain;}

/*disabled*/
.disabled{ pointer-events: none;}

/*hd*/
header .disabled{ opacity:0.3!important;}
.hdScr.on .disabled{ opacity:0.7!important; color: #60bcf1;}

/*ft*/
footer .disabled{ opacity:0.2;}


/* icon
**********************************************************************/
.catch{ display: inline-block; background: #ff0000; padding:1px 6px; margin:0 0 0 10px; font-size: 10px; color: #fff; line-height: 1.4; border-radius: 2px;}


/* title
**********************************************************************/
.secTit{ margin:0 0 20px; font-size: 24px; color: #001239; line-height: 1.55; text-align: center; letter-spacing: 1px;}
.leftTit{ padding:0 0 0 18px; margin:0 0 34px; font-size: 22px; font-weight: bold; line-height: 1.5; letter-spacing: 1px;  border-left: #008fe1 4px solid;}


/* txt
**********************************************************************/
.mainTxt{ margin:-10px 0 24px; font-size: 16px; color: #545769; text-align: center; }

/*attention*/
.attention,
.attList li{ padding:0 0 0 1.1em; position: relative;}
.attention:before,
.attList li:before{ content: "※"; display: block; position: absolute; top: 0; left: 0;}

.attList .one,
.attList .two,
.attList .three,
.attList .four,
.attList .five{ padding:0 0 0 1.7rem; }
.attList .one:before{ content: "※1"; }
.attList .two:before{ content: "※2"; }
.attList .three:before{ content: "※3"; }
.attList .four:before{ content: "※4"; }
.attList .five:before{ content: "※5"; }

/*numberList*/
.numberList li,
.numberList02 li{ position: relative;}
.numberList > li{ padding:0 0 0 1.4em;}
.numberList > li.two{ padding:0 0 0 2.8em;}

.numberList02{ margin:6px 0 8px;}
.numberList02 > li{ padding:0 0 0 2.8em;}
.numberList02 > li.two{ padding:0 0 0 4em;}
.numberList li span,
.numberList02 li span{ display: block; position: absolute; top: 0; left: 0;}

/*chapterList*/
.chapterList li{ padding:0 0 0 4em; position: relative;}
.chapterList li span{ display: block; position: absolute; top: 0; left: 0;}

/*dotList*/
.dotList > li{ padding:0 0 0 1.2em; position: relative;}
.dotList > li:before{ content: "・"; display: block; position: absolute; top: 0; left: 0;}

/* linkList*/
.linkList li{ background: #fff; margin:10px 0 0;}
.linkList li:first-child{ margin:0;}
.linkList li a{ display: block; padding:18px 48px 18px 18px; position: relative; font-size: 16px; font-weight: bold; border: #fff 2px solid; }
.linkList li a:before{ content: ""; display: block; background: url("../img/icon_arrow01.png")no-repeat; background-size: cover; width: 6px; height: 10px; position: absolute; top: 50%; right: 24px; -webkit-transform: translate(0, -50%); transform: translate(0, -50%);}
.linkList li a .day{ display: block; margin:0 0 8px; font-size: 12px; font-style: italic; font-weight: normal;}
.linkList li a .topic{ display: table; padding:2px 20px 1px; margin:0 0 8px; font-size: 11px; color: #008fe1; border: #008fe1 1px solid; vertical-align: top; border-radius: 2px;}

/* itemList*/
.itemList{ margin:0 auto; overflow: hidden;}
.itemList ul{ margin:-20px 0 0;}
.itemList ul li{ margin:20px 0 0; }

.itemList ul li img{ display: block; width:auto; height: 50px; margin:0 auto 22px;}
.itemList ul li h3{ margin:0 0 10px; font-size: 18px; color: #021338; font-weight: bold; text-align: center; letter-spacing: 1px;}
.itemList ul li p{ font-size: 15px; color: #545769;}
.itemList ul li .small{ display: inline-block; margin:0 0 0 4px; font-size: 11px; color: #9799a3;}

/* faqList*/
.faqList > li{ background: #fff; margin:20px 0 0; padding:26px 0; border: #fff 2px solid;}
.faqList > li:first-child{ margin:0;}
.faqList li .question{ padding:0 30px 0 56px; font-size: 16px; font-weight: bold; }
.faqList li .question,
.faqList li .answer > div{ position: relative;}
.faqList li .answer > div{ padding:14px 30px 0 56px; font-size: 15px;}

.faqList li .question:before,
.faqList li .answer > div:before{ display: block; width: 26px; height: 26px; padding:5px 0 0; position: absolute; left: 20px; font-size: 15px; font-weight: bold; color: #fff; line-height: 1; text-align: center; border-radius: 13px; box-sizing: border-box; }
.faqList li .question:before{ content: "Q"; background: #008fe1; top: 0; }
.faqList li .answer > div:before{ content: "A"; background: #ff5773; top: 14px; }

/*openFaq*/
.openFaq > li{ min-height: auto; transition: border 0.3s ease-in-out 0s;}
.openFaq > li:hover{ border: #008fe1 2px solid; }
.openFaq li .question{ padding:0 60px 0 56px; cursor: pointer;}
.openFaq li .question:after{ content: ""; background: url("../img/icon_arrow03.png") no-repeat; background-size: cover; display: block; width: 10px; height: 6px; position: absolute; top: 14px; right: 30px;}
.openFaq li.on .question:after{ background: url("../img/icon_arrow04.png") no-repeat; background-size: cover;}

.openFaq li .answer{ height: 0; overflow: hidden;}
.openFaq li .answer > div{ padding:14px 60px 0 56px;}

/*close*/
.closeTxt02{ display: table; margin: 20px auto 0; padding: 12px 100px 10px; position: relative; font-size: 16px; font-weight: bold; color: #ff0000; line-height: 1.5; text-align: center; border: #ff0000 4px solid; }
.closeTxt02{ background: rgba(255,255,255,0.6); }


/* sns
**********************************************************************/
.shareBox{ margin: 0 0 20px; text-align: right;}
.shareBox ul li{ display: inline-block; margin: 0 0 0 5px; vertical-align: top;}
.shareBox ul li:last-child{ padding:0;}
.shareBox ul li img{ width: 27px;}


/* entry
**********************************************************************/
#entry{ background: #008fe1; padding:0 10px; color: #fff;}
#entry .secTit{ color: #fff;}
#entry .btn{ background: #fff; margin:0 auto; padding: 14px 36px 12px; font-size: 15px; font-weight: bold; color: #008fe1;}
#entry .btn .blank02:before{ right: -18px; }
#entry .wrap > p{ margin:14px 0 0; font-size: 13px; text-align: center;}

#entry .detail{ padding:20px 0 0; margin:16px 0 0; border-top: #8ccef6 1px solid;}
#entry .detail > p{ font-size: 18px; }
#entry .detail ul{ margin:20px auto 0; overflow: hidden;}
#entry .detail ul li{  padding:16px 16px 14px 76px; margin:10px 0 0; border: #8ccef6 1px solid; border-radius: 3px;}

#entry .detail ul li:first-child{ background: url("../img/entry_icon01.png") no-repeat 20px 19px; background-size: auto 36px; margin:0; }
#entry .detail ul li:nth-child(2){ background: url("../img/entry_icon02.png") no-repeat 20px 19px; background-size: auto 36px; }
#entry .detail ul li:nth-child(3){ background: url("../img/entry_icon03.png") no-repeat 20px 22px; background-size: auto 36px; }
#entry .detail ul li p{ font-size: 15px;}
#entry .detail ul li a{ font-size: 13px; color: #fff; text-decoration: underline;}


/* main
**********************************************************************/
main{ display: block; padding:46px 10px 54px;}
main > div{ max-width: 1200px; margin:0 auto; position: relative;}
main > div:before{ content: ""; display: none; position: absolute;}

main .txt h1{ color: #fff; letter-spacing: 1px; }
main .txt h1 span{ color: #e0f4ff; line-height: 1.7;}
main .whiteBorder{ border: #fff 1px solid!important; box-shadow: none!important;}


/* submain
**********************************************************************/
.subMain{ background: #0080ca; padding:46px 10px 0; }
.subMainBg{ background: url(../img/main_bg.jpg) no-repeat center top!important; background-size: cover;}

.subMain .txt{ color: #fff;}
.subMain .txt h1{ font-size: 32px;}
.subMain .txt p{ margin:6px 0 0; font-size: 16px;}
.subMain .blank{ right: -10px; }

/*subTxt*/
main .subTxt { color: #e0f4ff!important; position: relative;}
main .subTxt h1{ font-size: 32px; color: #fff; line-height: 1.4;}
main .subTxt h1 span{ display: block; background: url("../img/main_icon02.png")no-repeat left top; background-size: 25px auto; margin:0 0 20px; padding:0 0 0 38px; font-size: 17px; }
main .subTxt p{ margin:20px 0 0!important; font-size: 16px; line-height: 1.8; letter-spacing: 1px;}

/*point*/
.subMain .point{ margin:26px 0 0; overflow: hidden;}
.subMain .point li{ background: url("../img/main_icon03.png") no-repeat left 4px; background-size:14px auto; padding:0 0 0 22px; margin:10px 0 0; }
.subMain .point li:first-child{ margin:0;}

/*directoryMenu*/
.directoryMenu{ margin:40px -10px 0; overflow: hidden; }
.directoryMenu li{ width: 50%; float: left; border-top: #fff 1px solid; border-right: #fff 1px solid;}
.directoryMenu li:nth-child(even){ border-right: none;}
.directoryMenu li a{ display: block; padding:13px 22px 11px; font-size: 13px; color: #fff; text-align: center;}
.directoryMenu .on a{ background: #fff; color: #008fe1; }


/* pankuzu
**********************************************************************/
.pankuzu{ max-width: 1200px; margin:28px auto 0; padding:0 10px; }
.pankuzu ul{ display: inline-block;}
.pankuzu ul li{ padding:0 8px 0 0; margin:10px 8px 0 0; float: left; font-size: 12px; color: #888; line-height: 1.2; border-right: #888 1px solid; }
.pankuzu ul li:last-child{ margin:10px 0 0; padding:0; border-right: none;}
.pankuzu ul li a{ font-size: 12px; color: #333;}


/* pageMenu
**********************************************************************/
.pageMenu{ margin:24px 0 0; padding:0 10px;}
.pageMenu ul{ display: table; background: #f1f6f9; margin:0 auto; padding:8px 10px 7px; overflow: hidden; border-radius: 10px; }
.pageMenu ul li{ float: left; padding:6px 0; line-height: 1.2; }

.pageMenu ul li a{ display: block; padding:0 14px; font-size: 13px; border-right: #d2d2d2 1px solid;}
.pageMenu ul li:last-child a{ border-right: none;}
.pageMenu ul li a:hover{ text-decoration: underline;}


/* featureBox
**********************************************************************/
.featureBox{ max-width: 1060px; margin:0 auto; overflow: hidden;}
.featureBox li{ background: #fff; padding:40px 20px 24px; margin:10px 0 0; position: relative; border: #e5e5e5 1px solid; border-radius: 5px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.05);}
.featureBox li:first-child{ margin:0;}

.featureBox li:before,
.featureBox li:after{ content: ""; display: block; position: absolute; }
.featureBox li:before{ width: 80px; height: 9px; top: 27px; left: 20px;}
.featureBox li:after{ width: 35px; height: 22px; top: 20px; right: 14px;}

.featureBox li:nth-child(1):before{ background: url("../img/featureBox_txt01.png") no-repeat; background-size: contain;}
.featureBox li:nth-child(2):before{ background: url("../img/featureBox_txt02.png") no-repeat; background-size: contain;}
.featureBox li:nth-child(3):before{ background: url("../img/featureBox_txt03.png") no-repeat; background-size: contain;}
.featureBox li:nth-child(1):after{ background: url("../img/featureBox_number01.png") no-repeat; background-size: 35px auto;}
.featureBox li:nth-child(2):after{ background: url("../img/featureBox_number02.png") no-repeat; background-size: 35px auto;}
.featureBox li:nth-child(3):after{ background: url("../img/featureBox_number03.png") no-repeat; background-size: 35px auto;}

.featureBox li img{ display: block; width: 180px; margin:0 auto;}
.featureBox li h3{ margin:22px 0 14px; font-size: 18px; color: #021338; font-weight: bold; text-align: center;}
.featureBox li p{ color:#545769; text-align: center;}


/* table
**********************************************************************/
.scroll{ width: 100%; overflow-x: scroll;}
.scroll table{ width: 100%;}
.scrollTxt{ display: table; margin: 8px auto 0; padding: 0 20px; position: relative; font-size: 12px; line-height: 1.9; letter-spacing: 0;}
.scrollTxt:before{ content: ""; display: block; background: #222; width: 100%; height: 2px; margin: -1px 0 0; position: absolute; top: 50%; left: 0;}

.scrollTxt span{ display: inline-block; background: #fff; padding: 0 8px; position: relative; }
.scrollTxt span:before,
.scrollTxt span:after{ content: ""; display: block; width: 0; height: 0; position: absolute; top: 6px;  border: 5px solid transparent;}
.scrollTxt span:before{ border-right: 10px solid #222; left: -30px; }
.scrollTxt span:after{ border-left: 10px solid #222; right: -30px;}

@media print, screen and (max-width:320px){
	.scrollTxt{ padding: 0 12px;}
	.scrollTxt span:before{ left: -24px;}
	.scrollTxt span:after{ right: -24px;}
}

/*table01*/
.table01{ min-width: 900px; border-right: #d6d6d6 1px solid; border-bottom:#d6d6d6 1px solid; }
.table01 th,
.table01 td{ padding:6px 18px 4px; border-top: #d6d6d6 1px solid; border-left:#d6d6d6 1px solid;}
.table01 thead{ background: #ededed;}
.table01 thead tr th{ height: 54px; padding:12px 18px 8px; font-size: 15px;}

.table01 tbody tr th{ background: #f9f9f9; }
.table01.thGray tbody tr th{ background: #ededed; }
.table01 tbody tr th,
.table01 tbody tr td{ height: 50px; }
.table01 tbody tr:nth-child(even){ background: #f9f9f9;}
.table01 tbody tr td.ok{ background: url("../img/icon_ok.png") no-repeat center; background-size: 20px 16px; }
.table01 tbody tr td.ok.left{ background: url("../img/icon_ok.png") no-repeat 12px center; background-size: 20px 16px; }
.table01 tbody tr td.ok02 span{ display: inline-block; background: url("../img/icon_ok.png") no-repeat left center; background-size: 20px 16px; padding:0 0 0 30px; }

/*infotable*/
.infotable{ min-width: 900px; font-size: 13px; border-right: #d6d6d6 1px solid; border-bottom:#d6d6d6 1px solid; }
.infotable th,
.infotable td{ padding: 7px 6px 6px; border-top: #d6d6d6 1px solid; border-left:#d6d6d6 1px solid;}
.infotable th{ text-align: center; font-weight: bold;}
.infotable.which tbody th{ text-align: left;}

.infotable.before thead th,
.infotable.which thead th{ background: #e8e8e8;}
.infotable.before tbody th,
.infotable.which tbody th{ background: #f8f8f8; }
.infotable.which tbody th.bgNone{ background: none; font-weight: normal;}

.infotable.after thead th,
.infotable.which thead th:last-of-type{ background: #ffdcde;}
.infotable.after tbody th,
.infotable.which tbody td:last-of-type{ background: #fff8f8; }
.infotable.which tbody td:last-of-type{ font-weight: bold;}

.infotable.before td,
.infotable.after td,
.infotable.which td{ text-align: right;}

/*plantable*/
.planTable{ min-width: 980px;}
.table01 th,
.table01 td { padding: 11px 10px 10px;}

.planTable thead th,
.planTable tbody td{ text-align: center;}
.planTable tbody th{ width: 14%;}
.planTable tbody td s{ display: block; font-size: 12px;}
.planTable .entry td{ padding:12px 10px 10px;}
.planTable .entry .btn{ display: block; padding:3px 0; text-align: center; }

.planTable .individual,
.planTable .corporation{ position: relative; color: #fff;}
.planTable .individual{ background: #008fe1;}
.planTable .corporation{ background: #616dd8;}

.planTable .individual:before,
.planTable .corporation:before{ display: block; background: url("../img/icon_crown.png") no-repeat center top; background-size: 18px auto; padding:15px 0 0; position: absolute; top: -40px; left: 50%; font-size: 11px; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); }
.planTable .individual:before{ content: "個人人気"; color: #008fe1;}
.planTable .corporation:before{ content: "法人人気"; color: #616dd8;}
.discount{ display: block; width: 88px; padding:1px 0; margin:0 auto 8px; color: #f30000; text-align: center; border: #f30000 1px solid; border-radius: 20px; }


/* symbol
**********************************************************************/
.symbol{ margin: 30px 0 0; overflow: hidden; font-size: 0.93rem;}
.symbol dt{ display: table; background: #28caa3; padding: 0.14rem 16px 0; margin: 0 0 12px; color: #fff; text-align: center; border-radius: 20px;}
.symbol dd{ margin: 0 0 0 15px; float: left;}
.symbol .check{ background: url(../img/icon_ok.png) no-repeat left center; background-size: 20px auto; padding: 0 0 0 22px; margin: 0;}


/* readBox
**********************************************************************/
.readBox{ background: #f7f7f7; margin:26px 0 0; padding: 20px; font-size: 13px;}
.readBox02{ background: #f2f2f2; padding: 20px; }
.readBox03{ background: #f8f8f8; padding: 20px; }


/* borderBox
**********************************************************************/
.borderBox{ padding:20px; border: #e0e0e0 5px solid;}


/* detailL
**********************************************************************/
.detailL{ background: #fff; padding:30px 15px; overflow: hidden; border: #e5e5e5 1px solid; border-radius: 5px;}
.detailL .txt h3{ margin:0 0 16px; font-size: 22px; font-weight: bold;}
.detailL .txt h3 span{ display: table; background: #eef050; padding:0 10px; margin:0 0 12px; font-size: 11px; text-align: center; border-radius: 9px;}

.detailL .txt p{ font-size: 15px;}
.detailL .txt .price{ margin:18px 0 0; font-size: 16px; font-weight: bold; text-align: center;}
.detailL .txt .btn{ width: 180px; height: 40px; margin:10px auto 0; padding:5px 10px 0; letter-spacing: 1px; }
.detailL > img{ display: block; max-width: 431px; margin:20px auto 0; padding:0 0 0 6%; }
#cdn .detailL > img{ padding:0 6% 0 0; }


/* priceBox
**********************************************************************/
.priceBox{ min-width: 1200px; margin:0 0 0 -1.5%; overflow: hidden; }
.priceBox > li{ background: #fff; width: 23.5%; margin:60px 0 10px 1.5%; padding:34px 24px 50px; float: left; position: relative; text-align: center; border: #e2e2e2 1px solid; border-radius: 5px;}
.priceBox > li:after,
.priceBox > li:before{ content: ""; display: block; position: absolute; left: 50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); }
.priceBox > li:after{ width: 41px; height: 62px; top: -54px; }
.priceBox > li:before{ background: url("../img/priceBox/bg01.png") no-repeat; background-size: cover; width: 68px; height: 50px; top: -28px;  }

.priceBox > li.box01:after{ background: url("../img/priceBox/icon01.png") no-repeat; background-size: cover;}
.priceBox > li.box02:after{ background: url("../img/priceBox/icon02.png") no-repeat; background-size: cover;}
.priceBox > li.box03:after{ background: url("../img/priceBox/icon03.png") no-repeat; background-size: cover;}
.priceBox > li.box04:after{ background: url("../img/priceBox/icon04.png") no-repeat; background-size: cover;}
.priceBox > li.box05:after{ background: url("../img/priceBox/icon05.png") no-repeat; background-size: cover;}
.priceBox > li.box06:after{ background: url("../img/priceBox/icon06.png") no-repeat; background-size: cover;}
.priceBox > li.box07:after{ background: url("../img/priceBox/icon07.png") no-repeat; background-size: cover;}
.priceBox > li.box08:after{ background: url("../img/priceBox/icon08.png") no-repeat; background-size: cover;}

.priceBox li div{ padding:0 0 10px; margin:0 0 22px; color: #008fe1; letter-spacing: 1px; border-bottom: #dadada 1px solid;}
.priceBox li div > span{ display: block; margin:0 0 2px; font-weight: bold;}
.priceBox li div p > span{ font-weight: bold; }
.priceBox li div p span > span{ display: inline-block; margin:0 4px; font-size: 30px; letter-spacing: 0;}
.priceBox li div p s{ display: block; margin:8px 0 -8px;}

.priceBox .list{ font-size: 14px;}
.priceBox .list li{ margin:7px 0 0; color: #898989;}
.priceBox .list li:first-child{ margin:0;}
.priceBox .list li span{ font-weight: bold; color: #333;}

/*priceBox corporation*/
.priceBox li .popular{ background: #fff; min-width: 72px; height: 20px; padding:1px 6px 0; position: absolute; top: 10px; right: -1px; font-size: 10px; text-align: center; border-radius: 4px 0 0 4px; }
.priceBox .individual .popular{ color: #008fe1;}
.priceBox .corporation .popular{ color: #616dd8;}
.priceBox .individual:before{ background: url("../img/priceBox/bg02.png") no-repeat; background-size: cover; top: -28px; }
.priceBox .corporation:before{ background: url("../img/priceBox/bg03.png") no-repeat; background-size: cover; top: -28px;}

.priceBox .individual,
.priceBox .corporation{ color: #fff!important; box-shadow:0 0 20px -2px #a8a7a7;}
.priceBox .individual{ background: #008fe1!important;}
.priceBox .corporation{ background: #616dd8!important;}
.priceBox .individual div{ border-bottom: #5db3e4 1px solid!important;}
.priceBox .corporation div{ border-bottom: #9fa7f4 1px solid!important;}

.priceBox .individual div,
.priceBox .individual div p span > span,
.priceBox .individual .list li span,
.priceBox .corporation div,
.priceBox .corporation div p span > span,
.priceBox .corporation .list li span{ color: #fff!important;}

.priceBox .individual div p,
.priceBox .individual li{ color: #dbf0fc!important;}
.priceBox .corporation div p,
.priceBox .corporation li{ color: #d3d7ff!important;}
.oemTxt{ margin-top: 10px; font-size: 14px; font-weight: bold; }


/* captionBox
**********************************************************************/
#captionBox{ background: #f4f4f4;}
#captionBox h4{ padding:0 0 6px; margin:0 0 22px; font-size: 18px; font-weight: bold; letter-spacing: 1px; border-bottom: #bfbfbf 1px solid;}


/* campBox
**********************************************************************/
.campBox{ margin:40px 0 0; padding:0 10px; }
.campBox > div{ max-width: 840px; margin:0 auto; border: #00c28d 4px solid; }

.campBox .saleTxt{ display: block; background: #fff; padding:14px 50px 14px 10px; position: relative; color: #00c28d; text-align: center;}
.campBox .saleTxt:before{ content: ""; display: block; background: url("../img/campBox_icon01.png") no-repeat; background-size: cover; width: 19px; height: 19px; position: absolute; top: 52%; right: 16px; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); }
.campBox .saleTxt img{ display: block; margin:0 auto; }

.campBox.site01 .saleTxt img{ width: 550px; }
.campBox.site02 .saleTxt img{ width: 510px; margin-bottom: -6px;}
.campBox.site03 .saleTxt img{ width: 525px; }
.campBox.site04 .saleTxt img{ width: 507px; margin-bottom: -6px;}
.campBox.site05 .saleTxt img{ width: 548px; margin-bottom: -6px;}
.campBox.site06 .saleTxt img{ width: 623px; margin-bottom: -6px;}

.campBox .txt{ background: #00c28d; padding:6px 6px 4px; color: #fff; overflow: hidden;}
.campBox .txt a{ display: inline-block; margin:0 2px; color: #fff;}
.campBox .txt span{ display: block; margin:4px 0 0;}


/* otherOption
**********************************************************************/
.otherOption{ overflow: hidden; letter-spacing: 1px;}
.otherOption li{ background: #fff; padding: 116px 20px 35px; position: relative; text-align: center; border: #e5e5e5 1px solid; border-radius: 5px;}
.otherOption .wp{ margin:20px 0 0;}

.otherOption li:before{ content: ""; display: block; background-size: cover!important; width: 60px; height: 70px; margin:0 0 0 -30px; position: absolute; top: 30px; left: 50%;}
.otherOption .anshin:before{ background: url("../img/option/otherOption_img01.png") no-repeat;}
.otherOption .wp:before{ background: url("../img/option/otherOption_img02.png") no-repeat;}

.otherOption .tit,
.otherOption h4{ color: #333; font-size: 18px; font-weight: bold;}
.otherOption .tit span,
.otherOption h4 span{ background: #008fe1; width: 80px; padding:1px 0; font-size: 11px; position: absolute; top: 11px; right: 11px; color: #fff; border-radius: 2px; }
.otherOption p{ margin:10px 0 0; color: #666;}
.otherOption .btn{ width: 180px; margin:28px auto 0; padding:7px 10px;}


/* camp_area
**********************************************************************/
.camp_txt{ max-width: 980px; margin: 20px auto 0; padding: 14px; color: red; font-size: 18px; text-align: center; border: red 2px solid; }
.camp_txt a{ color: red; text-decoration: underline;}
.camp_txt a:hover{ text-decoration: none;}
.camp_txt.camp2023{ border-color: #e03455;}
.camp_txt.camp2023 a{ color: #e03455;}

.camp_area{ background: #F0F0F0; padding:16px 20px 24px; margin-top: 20px; text-align: center;}
.camp_area p{ margin-bottom: 4px; font-size: 18px; font-weight: bold; }
.camp_area .bnr{ display: flex; justify-content: center; gap: 16px;}
.camp_area .bnr.col03{ flex-wrap: wrap; gap: 10px 16px;}
.camp_area .bnr.col03 li{ width: calc((100% - 16px)/2);}

.camp_area .bnr a{ display: block; max-width: 263px;}


/* pdf_area
**********************************************************************/
#pdf_area{ background: white; padding: 0 10px;}
#pdf_area .wrap{ max-width: 1000px;}
#pdf_area .secTit{ font-size: 30px;}
#pdf_area .inr{ display: flex; gap: 44px; background: white; margin-top: 36px; padding: 48px; border: #008FE1 1px solid; border-radius: 10px;}
#pdf_area .img{ display: flex; justify-content: center; align-items: center; background: #F1F4F8; width: 284px; padding: 0 20px; border-radius: 10px;}
#pdf_area .img img{ display: block; max-width: 236px;}
#pdf_area .txt{ flex: 1;}
#pdf_area .txt dt{ margin-bottom: 10px; font-size: 20px; font-weight: bold;}
#pdf_area .txt .checkarea{ margin-top: 20px; padding: 16px; border: #E5E5E5 1px solid; border-radius: 10px;}
#pdf_area .txt .checkarea p{ font-weight: bold;}
#pdf_area .txt .checkarea ul{ display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; font-size: 12px;}
#pdf_area .txt .checkarea li{ width: calc((100% - 8px)/2); background: url("../img/pdfarea_check01.svg") no-repeat left top 5px /12px; padding-left: 16px;}
#pdf_area .txt .btn{ margin-top: 24px; font-weight: bold; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.20);}

@media print, screen and (max-width:960px){
	#pdf_area .inr{ gap: 20px; padding: 30px 20px;}
}
@media print, screen and (max-width:641px){
	#pdf_area .secTit{ font-size: 24px;}
	#pdf_area .inr{ flex-wrap: wrap; gap: 20px; margin-top: 26px; padding: 20px 20px 30px; }
	#pdf_area .img{ width: 100%; padding: 20px;}
	#pdf_area .txt{ flex: 0 0 100%;}
	#pdf_area .txt dt{ font-size: 16px;}
	#pdf_area .txt .checkarea ul{ flex-wrap: wrap; }
	#pdf_area .txt .checkarea li{ width: 100%;}
	#pdf_area .txt .btn{ margin: 20px auto 0;}
}


/*************************************************************************************************************************
* 641px以上用の記述
*************************************************************************************************************************/
@media print, screen and (min-width:641px){
	br.sp{ display: none;}
	br.tbpc{ display: block;}


	/* content
	**********************************************************************/
	.wrap{ padding:64px 0 70px; }


	/* title
	**********************************************************************/
	.secTit{ margin:0 0 30px; }
	.leftTit{ font-size: 25px; }


	/* txt
	**********************************************************************/
	.mainTxt{ margin:-10px 0 30px; }

	/*linkList*/
	.linkList li a .topic{ display: inline-block; margin:2px 22px 0 0;}

	/*itemList*/
	.itemList{ max-width: 600px;}
	.itemList ul{ margin:-40px 0 0;}
	.itemList ul li{ width: 48%; margin:40px 0 0 4%; float: left;}
	.itemList ul li:nth-child(odd){ margin:40px 0 0;}
	.itemList ul li h3{ margin-bottom: 18px;}

	/* faqList*/
	.faqList li .question{ font-size: 18px; }
	.faqList li .answer > div{ font-size: 17px;}
	.faqList li .question:before,
	.faqList li .answer > div:before{ font-size: 17px; }
	.faqList li .answer > div:before{ padding:3px 0 0;  top: 16px;}


	/* main
	**********************************************************************/
	main .subTxt h1{ font-size: 38px; }
	main .subTxt h1 span{ margin:0 0 30px; }
	.subMain .txt h1 { font-size: 36px; letter-spacing: 1px; }
	.subMain .point li{ margin:0 0 0 36px; float: left;}


	/* pageMenu
	**********************************************************************/
	.pageMenu ul{ padding:8px 6px 7px; border-radius: 30px; }
	.pageMenu ul li a{ padding:0 26px; }


	/* featureBox
	**********************************************************************/
	.featureBox li{ width: 32.333%; padding-top:60px; margin:0 0 0 1.5%; float: left; }
	.featureBox li:before{ top: 37px;}
	.featureBox li:after{ top: 25px; }


	/* symbol
	**********************************************************************/
	.symbol{ margin: 50px 0 0; overflow: hidden;}
	.symbol dt{ float: left;}
	.symbol dd{ padding:2px 0 0;}
	.symbol .check{ margin: 0 0 0 18px; padding: 2px 0 0 22px;}


	/* readBox
	**********************************************************************/
	.readBox{ padding: 30px;}
	.readBox02,
	.readBox03{ padding: 24px 30px; }


	/* borderBox
	**********************************************************************/
	.borderBox{ padding:25px; }


	/* otherOption
	**********************************************************************/
	.otherOption li{ width: 48.6%; padding:146px 20px 50px; float: left;}
	.otherOption li:last-child{ float: right;}
	.otherOption .wp{ margin:0;}
	.otherOption li:before{ top:50px;}

	.camp_area .bnr.col03{ gap: 10px 30px;}
	.camp_area .bnr.col03 li{ width: auto;}
}


@media print, screen and (min-width:700px) {
	/* footer
	**********************************************************************/
	.ftTop .main{ overflow: hidden;}
	.ftTop .main > li{ width: 25%; float: left;}

	.ftBtm ul{ display: table; margin:0 auto; overflow: hidden;}
	.ftBtm ul li{ margin:0 0 0 20px; float: left;}
	.ftBtm ul li:first-child{ margin:0;}
}


/*************************************************************************************************************************
* 980px以上用の記述
*************************************************************************************************************************/
@media print, screen and (min-width:980px){
	body{ line-height: 1.75;}
	br.pc{ display: block;}
	br.sptb{ display: none;}
	.sptbNone{ display: block;}

	/* txt */
	.txtdeco:hover{ text-decoration: none;}

	header > div,
	header nav,
	.menuBox .other .btn ,
	.menuBox .main > li a,
	.menuBox .other .menu li a,
	.hdScr .logo,
	.ftTop .sns li a,
	#entry .btn{ -webkit-backface-visibility: hidden; backface-visibility: hidden;}


	/* header
	**********************************************************************/
	header{z-index: 10000!important;}
	header > div{ width: 100%; height: auto; padding:0 10px; }
	header a{ color: #fff; font-size: 12px!important;}
	header nav{ width: 100%; min-height: 40px; height: 100%;  padding:0 0 0 170px; margin:0 auto; position: relative;  transition: width 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
	header .logo{ display: block;}
	header .spBtn{ display: none;}

	/*bg*/
	header .bg{ display: none!important;}
	.menuBox{ background: none; width: 100%; overflow: inherit; max-width: none; position: static; padding-top: 9px; }
	.menuBox .main{ overflow: hidden; float: left; border-top: none;}
	.menuBox .main > li{ margin:0 0 0 8px; float: left; border-bottom: none;}
	.menuBox .main > li:first-child{ margin:0;}

	.menuBox .main > li .open{ z-index: 10;}
	.menuBox .main > li .open a{ background: url("../img/hd_arrow01.png") no-repeat right 0.8em; background-size:7px auto;  padding:0 14px 0 0; }
	.menuBox .main > li > a,
	.menuBox .main > li .open a,
	.menuBox .main .innerMenu li a{ min-height: inherit; }
	.menuBox .main > li > a{ background: none; padding:0;}
	.menuBox .main > li .open span{ display: none;}
	.menuBox .main .media{ display: none;}

	/*innerMenu*/
	.menuBox .main .innerMenu{ display: none; width: 100%; height: 40px; padding:4px 0 0; position: absolute; bottom: 0; left: 0; }
	.menuBox .main .innerMenu ul{ display: table; margin:0 auto;}
	.menuBox .main li:nth-child(-n+3) .innerMenu ul{ margin:0;}

	.menuBox .main .innerMenu li{ margin:0 0 0 24px; float: left; border-top: none;}
	.menuBox .main .innerMenu li:first-child{ margin:0;}
	.menuBox .main .innerMenu li a{ padding:0;}
	.menuBox .main .innerMenu li a.blank:before{ right: -16px; top: 6px;}
	.menuBox .main .innerMenu li > span{ display: block; background: #fff;  width: 0; height: 1px; margin:1px 0 0; }

	/*other*/
	.menuBox .other{ padding:0; height: 30px; position: relative; float: right; }
	.menuBox .other *{ font-size: 11px!important; letter-spacing: 0px!important;}
	.menuBox .other .menu,
	.menuBox .other .menu li{ float: left;}
	.menuBox .other .menu li a{ background: url("../img/hd_arrow02.png") no-repeat left 0.45rem!important; background-size:auto 7px!important; min-height: inherit; margin:0 8px 0 0!important; padding:0 0 0 10px!important; }

	.menuBox .other .menu .affili span{ display: none;}
	.menuBox .other .btnBox{ margin:-4px 10px 0 0;}
	.menuBox .other .btnBox,
	.menuBox .other .btnBox li{ float: left;}
	.menuBox .other .btnBox .btn{ background: #FBB500!important; width: 84px; height: 30px; min-height: inherit; padding:4px 0 0; margin:0; color: white!important; border-color: #FBB500!important; transition: background 0.3s ease-in-out 0s,color 0.3s ease-in-out 0s,border 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.menuBox .other .btnBox .btn:hover{ background: #FFBF19!important;}
	.menuBox .other .btnBox .login{ margin-right: 9px;}
	.menuBox .other .btnBox .login a{ background: white!important; color: #008FE1!important; border-color: #008FE1!important; }
	.menuBox .other .btnBox .login a:hover{ background: #008FE1!important; color: white!important; border-color: white!important;}
	.menuBox .other .sns,
	.menuBox .other .closeTxt{ display: none; }

	.lhc-status-native-online a:before{ content: "ライブチャット"; }
	.lhc-status-native-offline a:before{ content: "ライブチャット"; }

	/*side*/
	header .side a{ transition: background 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	header .side a:hover{ background: #15bad3;}
	header .paypal{ display: block; }
	header .paypal a{ transition: opacity 0.3s ease-in-out 0s;}
	header .paypal a:hover{ opacity: 0.9;}

	/*normal on*/
	header.on > div{ background: rgba(0,16,47,0.7);}

	/**hdScr**/
	.hdScr a{ color: #333;}
	.hdScr .logo{ background: url("../img/hd_logo_01.png")no-repeat; background-size: contain; transition: background 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.hdScr .menuBox .main > li .open a{ background: url("../img/hd_arrow01_02.png") no-repeat right 0.8em; background-size:7px auto; }
	.hdScr .menuBox .other .menu li a{ background: url("../img/hd_arrow02_02.png") no-repeat left 0.45rem!important; background-size:auto 7px!important;  }

	/*hdScr (scroll on)*/
	.hdScr.on{ background: #4fadef; height: 40px; }
	.hdScr.on > div{ background: rgba(0,128,218,0.85); }
	.hdScr.on a{ color: #fff;}

	.hdScr.on .logo{ background: url("../img/hd_logo.png")no-repeat; background-size: contain;}
	.hdScr.on .menuBox .main > li .open a{ background: url("../img/hd_arrow01.png") no-repeat right 0.5rem; background-size:7px auto; }
	.hdScr.on .menuBox .other .menu li a{ background: url("../img/hd_arrow02.png") no-repeat left 0.45rem!important; background-size:auto 7px!important;  }
	.hdScr.on .menuBox .other .btnBox .login a:hover{ border-color: #008FE1!important;}

	/***txt hover***/
	.menuBox .main > li > a,
	.menuBox .main > li .open > a,
	.menuBox .other .menu li a{ transition: opacity 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}

	.menuBox .main > li > a:hover,
	.menuBox .main > li .open > a:hover,
	.menuBox .other .menu li a:hover{ opacity:0.8;}

	/*livechat*/
	.menuBox .other .menu .live a,
	.hdScr.on .menuBox .other .menu .live a{ background: url(../img/hd_arrow02.png) no-repeat left 1rem!important; background-size: auto 7px!important; margin-top: -8px!important; }
	.menuBox .other .menu .live a:before{ display: block; line-height: 36px; }
	.menuBox .other .menu .live a:after{ display: none;}
	.hdScr .menuBox .other .menu .live a{ background: url(../img/hd_arrow02_02.png) no-repeat left 1rem!important; background-size: auto 7px!important;}

	.menuBox .other .menu .live .lhc-status-native-online a:after,
	.hdScr.on .menuBox .other .menu .live .lhc-status-native-online a:after{ color: #d7f1ff; }
	.hdScr .menuBox .other .menu .live .lhc-status-native-online a:after{ color: #aaa; }


	/* pagetop
	**********************************************************************/
	.pagetop{ right: 20px; bottom: 120px; }
	.pagetop:hover{ opacity:0.7;}

	/* contact fix */
	.contactFix{ display: block;}
	.contactFix a:hover,
	.contactFix .live a:hover:before{ text-decoration: none;}


	/* footer
	**********************************************************************/
	footer > div{ padding:64px 10px 70px;}
	.ftTop{ overflow: hidden;}
	.ftTop .logo{ float: left;}
	.ftTop .main{ width: 78%; margin:10px 0 0; float: right; }
	.ftTop .main > li > a,
	.ftTop .main > li > p{ display: inline-block; margin:0 0 14px;}

	.ftTop .sns li{ margin:0; }
	.ftTop .sns li:not(:nth-child(1)){ margin:0 0 0 10px;}
	.ftTop .sns li a{ transition: opacity 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.ftTop .sns li a:hover{ opacity:0.6;}

	.ftBtm{ margin:36px auto 0; padding:34px 0 0;}
	.ftBtm ul li{ margin:0 0 0 44px; }
	.ftTop .main > li > a:hover,
	.ftTop .innerMenu li a:hover,
	.ftBtm ul li a:hover{ text-decoration: underline;}


	/* content
	**********************************************************************/
	.wrap{ padding:82px 0 96px; }


	/* btn
	**********************************************************************/
	.newsBtn:hover span,
	.txtLink:hover{ text-decoration: none!important;}

	.btn.blueBorder,
	.btn.whiteBorder{ transition: color 0.3s ease-in-out 0s, background 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.btn.blueBorder:hover{ background: #008fe1; color: #fff;}
	.btn.whiteBorder:hover{ background: #fff; color: #008fe1!important;}

	.blank{ transition: background 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.btn.whiteBorder:hover .blank:before{ background: url("../img/icon_blank01.png") no-repeat; background-size: contain;}

	.blueBtn{ transition: background 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.blueBtn:hover{ background: #20a1eb; }
	.btn:hover .blank02:before{ background: url("../img/icon_blank02.png") no-repeat; background-size: contain;}


	/* title
	**********************************************************************/
	.secTit{ font-size: 30px; line-height: 1.8; text-align: center;}


	/* txt
	**********************************************************************/
	.mainTxt{ margin:-10px 0 50px; font-size: 18px; }

	/* linkList */
	.linkList li a{ padding:24px 68px 24px 28px; transition: color 0.3s ease-in-out 0s, border 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.linkList li a:hover{ color: #008fe1; border: rgb(0, 128, 202) 2px solid; box-shadow: 0 0 18px -2px #e5e3e3; }
	.linkList li a:before{ right: 30px;}
	.linkList li a:hover:before{ background: url("../img/icon_arrow02.png")no-repeat; background-size: cover;}

	/*itemList*/
	.itemList{ max-width: 1020px;}
	.itemList ul{ margin:-40px 0 0 -4.9%;}
	.itemList ul li{ width: 28.4%; margin:40px 0 0 4.9%!important; float: left;}


	/* sns
	**********************************************************************/
	.shareBox ul li a{ transition: opacity 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.shareBox ul li a:hover{ opacity:0.7;}


	/* entry
	**********************************************************************/
	#entry .wrap{ padding:100px 0 120px;}
	#entry .detail{ padding:36px 0 0; margin:42px 0 0;}
	#entry .detail > p{ font-size: 20px; text-align: center;}
	#entry .detail ul{ margin:30px auto 0; }
	#entry .detail ul li{ width: 32%; padding:16px 16px 14px 72px; margin:0 0 0 2%; float: left; }
	#entry .detail ul li:nth-child(2){ padding:16px 16px 14px 80px;}

	/*hover*/
	#entry .btn{ transition: color 0.3s ease-in-out 0s ,background 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	#entry .btn:hover{ background: #025584; color: #fff;}
	#entry .detail ul li a:hover{ text-decoration: none;}


	/* main
	**********************************************************************/
	main{ padding:60px 10px 22px; }
	main > div:before{ display: block; }


	/* submain
	**********************************************************************/
	.subMain{ padding:60px 10px 0; }

	/* directoryMenu */
	.directoryMenu{ margin:56px 0 0; }
	.directoryMenu li{ width: auto; border-top: none; border-right: none;}
	.directoryMenu li a{ font-size: 14px; border-radius: 3px 3px 0 0; transition: background 0.3s ease-in-out 0s,color 0.3s ease-in-out 0s; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
	.directoryMenu li a:hover{ background: #fff; color: #008fe1; }


	/* pankuzu
	**********************************************************************/
	.pankuzu{ text-align: right;}
	.pankuzu ul li a:hover{ text-decoration: underline;}


	/* pageMenu
	**********************************************************************/
	.pageMenu{ margin:30px 0 0; padding:0 10px;}


	/* featureBox
	**********************************************************************/
	.featureBox li{ width: 30.2%; margin:0 0 0 4.7%; padding:78px 20px 24px; }
	.featureBox li:before{ left: 25px;}
	.featureBox li:after{ right: 20px;}
	.featureBox li h3{ margin:18px -18px 12px; font-size: 20px; }


	/* table
	**********************************************************************/
	.scrollTxt{ display: none;}


	/* transfer
	**********************************************************************/
	.detailL{ padding:60px 40px; }
	.detailL .txt{ width: 53%; float: right;}
	.detailL .txt .price{ text-align: left; }
	.detailL .txt .btn{ margin:10px 0 0;}
	.detailL > img{  width: 40%; padding:0; margin: 0; }


	/* priceBox
	**********************************************************************/
	.priceBox .list{ font-size: 15px;}
	.oemTxt{ font-size: 16px; }


	/* campBox
	**********************************************************************/
	.campBox .saleTxt{ padding:14px 50px; transition: opacity 0.3s ease-in-out 0s;}
	.campBox .saleTxt:hover{ opacity:0.8;}
	.campBox .txt{ padding:6px 0 2px; }
	.campBox .txt p{ width: 82%; float: left; }
	.campBox .txt span{ width: 15%; margin:0; float: right;}

	/* camp_area
	**********************************************************************/
	.camp_area{ padding:24px 20px 40px; }
	.camp_area p{ font-size: 22px; }
	.camp_area .bnr{ gap: 50px;}

	.camp_area .bnr li:first-child a{ background: url("/common/img/coupon01_on.png"),no-repeat center; background-size: 100% auto;  }
	.camp_area .bnr li.off55 a{ background: url("/common/img/coupon01_55_on.png"),no-repeat center; background-size: 100% auto;  }
	.camp_area .bnr li.off40 a{ background: url("/common/img/coupon01_40_on.png"),no-repeat center; background-size: 100% auto;  }
	.camp_area .bnr li.off50 a{ background: url("/common/img/coupon01_50_on.png"),no-repeat center; background-size: 100% auto;  }
	.camp_area .bnr li:last-child a{ background: url("/common/img/coupon02_on.png"),no-repeat center; background-size: 100% auto;  }
	.camp_area .bnr a img{ transition: opacity 0.3s ease-in-out 0s; }
	.camp_area .bnr a:hover img{ opacity: 0;}
}


@media print, screen and (min-width:1040px) {
	.menuBox .main .media{ display: block;}

	/* transfer
	**********************************************************************/
	.detailL > img{ margin:-30px 0 0 30px; }
	#cdn .detailL > img{ margin: 0 0 0 20px; padding-right: 2%;}
	#anshin .detailL > img{ margin:-24px 0 0 30px; }
	#security .detailL > img{ margin:20px 0 0 30px; }
}


@media print, screen and (min-width:1200px) {
	/* header
	**********************************************************************/
	.menuBox .other .menu .affili span { display: inline-block; }
	.lhc-status-native-online a:before{ content: "ライブチャット受付中"; }
	.lhc-status-native-offline a:before{ content: "ライブチャット時間外"; }


	/* pankuzu
	**********************************************************************/
	.pankuzu ul{ margin:0 -10px;}
}
