/*LP--------------------*/
body{background: #fff; color: #111; font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
	--multiplier: calc(750px - 100%);/* 画面幅変数 */
	--multitxt:(100vw - 360px)/(1920 - 360);/* フォント可変 */
	--color1: #0E3870;/* メイン　紺 */
	--color2: #FF9900;/* サブ　オレンジ */
	--color2d: #b33000;/* サブ　オレンジ暗 */
	--color2l: #ffb600;/* サブ　黄明 */
	--color3: #3a3a3a;/* 見出し文字色　濃グレー */
	--color4: #F5F1DD;/* 背景アミ色　ベージュ系 */
	--color5: #e5eaf0;/* 背景アミ色　水色 */
	--color6: #448400;/* ボタン用　緑 */
	--color7: #1f3d00;/* ボタン用　緑影 */
	--color8: #F8F8F8;/* 薄グレー */
	--color9: #ea1200;/* 赤 */
	--color9d: #6b0a00;/* 赤暗 */
	--colorwt: #fff;/* 白 */
    --coloryl:#faec03;/* アクセント　黄 */
    --color_oki_bgl:#e60012;/* お買い得背景 */
    --color_oki_bgd:#7c000f;/* お買い得背景暗 */
}

/*文字色*/
.tx-color01{color:var(--color1);}/* メイン　紺 */
.tx-color02{color:var(--color2d);}/* サブ　オレンジ暗 */
.tx-color02l{color:var(--color2l);}/* サブ　黄明 */
.tx-color03{color:var(--color3);}/* 見出し文字色　濃グレー */
.tx-color09{color:var(--color9);}/* 赤 */
.tx-color-wt{color:var(--colorwt);}

/*背景色*/
.bg-color1{background: var(--color1);}/* メイン　紺 */
.bg-color2{background: var(--color2);}/* サブ　オレンジ */
.bg-color2d{background: var(--color2d);}/* サブ　オレンジ暗 */
.bg-color3{background: var(--color3);}/* 見出し文字色　濃グレー */
.bg-color4{background: var(--color4);}/* 背景アミ色　ベージュ系 */
.bg-color5{background: var(--color5);}/* 背景アミ色　水色 */
.bg-color6{background: var(--color6); box-shadow: 0px 5px 0px 0px var(--color7);}/* ボタン用　緑 緑影 */
.bg-color6:hover{background: var(--color7);}/* ボタン用　緑影 */
.bg-color8{background: var(--color8);}/* 薄グレー */
.bg-color9{background: var(--color9);}/* 赤 */
.bg-color9d{background: var(--color9d);}/* 赤暗 */
.bg-wt{background: var(--colorwt);}

/*文字制御*/
.tx_xs{font-size: calc(11px + (13 - 11)*var(--multitxt));}
.tx_s{font-size: calc(12px + (14 - 12)*var(--multitxt));}
.tx_m{font-size: calc(12px + (16 - 12)*var(--multitxt));}
.tx_ml{font-size: calc(13px + (18 - 13)*var(--multitxt));}
.tx_l{font-size: calc(18px + (20 - 18)*var(--multitxt));}
.tx_xl{font-size: calc(20px + (24 - 20)*var(--multitxt));}
.tx_xxl{font-size: calc(22px + (40 - 21)*var(--multitxt));}
.tx_xxxl{font-size: calc(24px + (44 - 24)*var(--multitxt));}
.h1sp{font-size: calc(16px + (36 - 16)*var(--multitxt));}/*h1タイトル用*/
.tx-center{text-align: center;}
.tx-right{text-align: right;}
.tx-wit_nm{font-weight: normal;}
.tx-round{font-family: 'Kosugi Maru', sans-serif;}/*丸文字 Google Fonts*/
.tx-lh-wide{line-height: 2;}
.l-hgt1{line-height: 1;}


/*コンテンツ--------------------*/
.wrap{max-width: 1240px; margin: 0 auto; padding: 0;position: relative;}
img, figuer img{width: 100%; height: auto; vertical-align: bottom;}
.linkimg a{width: 100%; display: block;}
.linkimg a:hover{opacity: 0.7; }
p{display: inline-block;}
small{font-size: 75%;}
sup{font-size: 75%;}
h1{ /*h1スクロールスナップ*/ 
	z-index: 1000;
	padding: 10px;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	left: 6px;}

/*コンテンツブロックスナップ--------------------*/
.block{
    width: 100%;
    min-height: 50vh;
	position: -webkit-sticky;
	position: sticky;
	top: 0;}
.block-one{z-index: 100;}

/*コンテンツ幅--------------------*/
.block-box{max-width: 990px; margin: 0 auto;}
.block-box-inbox{max-width: 920px; margin: 0 auto;}
.block-box-inbox2{max-width: 780px; margin: 0 auto;}

/*TOPに戻る--------------------*/
.retunetop{
position: fixed;
bottom: 5px;
right: 5px;
z-index: 2000;
height: 6vh;
margin: 0 auto; }
.retunetop a{display: flex; justify-content: center; align-items: center; text-align: center; width:100%; height:100%;color:var(--color1);background-color: var(--color5); border:1px solid var(--color1); border-radius: 5rem;padding: 0.8rem 0.5rem; line-height: 1rem;}
.retunetop a:hover{color:var(--colorwt); background-color: var(--color1);}

/*flex--------------------*/
.fx-wrap{ display: flex; flex-wrap:wrap; width: 100%;}
.fx-nowrap{ display: flex; flex-wrap:nowrap; width: 100%;}
.fx-2box > *{min-width: calc((100% - 2vw)/2); max-width: 100%; flex-basis: calc(var(--multiplier) * 999);}
.fx-3box > *{min-width: calc((100% - 1vw)/3); max-width: 100%; flex-basis: calc(var(--multiplier) * 999);}
.fx-4box > *{min-width: calc((100% - 1vw)/4); max-width: 49%; flex-basis: calc(var(--multiplier) * 999);}
.fx-5box > *{min-width: calc((100% - 5vw)/5); max-width: 49%; flex-basis: calc(var(--multiplier) * 999);}
.fx-between{justify-content: space-between;}
.fx-around{justify-content: space-around;}
.fx-center{justify-content: center;}
.fx-align-center{align-items: center;}
.fx-align-end{align-items: flex-end;}
.fx-dir-col{flex-direction: column;}
.fx-dir-row{flex-direction: row;}

/*レイアウト調整--------------------*/
.img-width img{width: auto;}
.d-block{display: block;}
.inblock{display: inline-block;}
.pos-rel{position: relative;}
.pos-abso{position: absolute;}
.va-m{vertical-align: middle;}
.img-clamp300{width:clamp(200px, 300px, 100%); margin: auto;}
.img-clamp400{width:clamp(320px, 400px, 100%); margin: auto;}
.img-clamp500{width:clamp(320px, 500px, 100%); margin: auto;}
.img-clamp960{width:clamp(320px, 960px, 100%); margin: auto;}

/*margin--------------------*/
.mtr05{margin-top: 0.5rem;}
.mtr1{margin-top: 1rem;}
.mtr2{margin-top: 2rem;}
.mtr3{margin-top: 3rem;}
.mtr4{margin-top: 4rem;}
.mtr5{margin-top: 5rem;}
.mbr05{margin-bottom: 0.5rem;}
.mbr1{margin-bottom: 1rem;}
.mbr2{margin-bottom: 2rem;}
.mbr3{margin-bottom: 3rem;}
.mbr4{margin-bottom: 4rem;}
.mbr5{margin-bottom: 5rem;}
.mrr05{margin-right: 0.5rem;}
.mrr1{margin-right: 1rem;}
.mrr2{margin-right: 2rem;}
.mlr1{margin-left: 1rem;}
.mlr03{margin:0 0.3rem;}
.mtb1_lrauto{margin: 1rem auto;}

/*padding--------------------*/
.pd03{padding: 0.3rem;}
.pd05{padding: 0.5rem;}
.pd1{padding: 1rem;}
.pdl1{padding-left: 1rem;}
.pdl2{padding-left: 2rem;}
.pdl6{padding-left: 6rem;}
.pdl7{padding-left: 7rem;}
.pdr05{padding-right:0.5rem;}
.pdr1{padding-right:1rem;}
.pdr2{padding-right:2rem;}
.pdb2{padding-bottom:2rem;}
.pdb4{padding-bottom:4rem;}
.pdb10{padding-bottom:10rem;}
.pdtb05lr1{padding:0.5rem 1rem;}
.pdtb1lr2{padding:1rem 2rem;}
.pdtb03{padding:0.3rem 0;}
.pdtb05{padding:0.5rem 0;}
.pdtb1{padding:1rem 0;}
.pdtb2{padding:2rem 0;}
.pdtb4{padding:4rem 0;}
.pdlr03{padding:0 0.3rem;}
.pdlr05{padding:0 0.5rem;}

/*見出し装飾*--------------------*/
.b_btm{border-bottom:1px var(--color1) dashed; padding:0 0 1rem;}
.b_bt_dt{border-bottom: 2px var(--color1) dotted; margin: 1rem 0; padding: 1rem 0;}
.b_lft{border-left: 8px var(--color2) solid; padding: 0 10px;}
.b_lft1{border-left: 8px var(--color1) solid; padding: 0 10px;}
.h_tag1{position: relative;display: inline-block;height: 44px;padding: 0.5rem 0 0.5rem 0.5rem; color: var(--colorwt); background: var(--color1); margin-right: 1.5rem;}
.h_tag1::after {position: absolute;top: 0;right: -10px;content: '';border-width: 22px 0 22px 10px;border-style: solid;border-color: transparent transparent transparent var(--color1);}

/*角丸--------------------*/
.radius{border-radius: 0.5rem;}
.radius_semi{border-radius: 0.8rem;}
.radius_round{border-radius: 1.8rem;}
.radius_full{border-radius: 6rem;}

/*囲み罫--------------------*/
.b_color01{border: 3px solid var(--color1);}
.b_color01-thin{border: 1px solid var(--color1);}
.b_color01-double{border: 6px double var(--color1);}
.b_color02{border: 3px solid var(--color2);}

/*囲みボックス　タイトルアミ--------------------*/
.waku{border: 3px solid var(--color1); border-radius: 0.5rem;}
.waku > * {padding: 0.5rem;}
.waku .title-ami{background: var(--color5);border-radius: 0.5rem 0.5rem 0 0;}
.waku .title-amic1{background: var(--color1);border-radius: 0; color:var(--colorwt);}

/*表　罫線--------------------*/
.table-head{background: var(--color1);border-radius: 0.5rem 0.5rem 0 0; color:var(--colorwt); padding: 0.5rem 0;}
.table{width: 100%; padding:0;border: 1px solid var(--color1); border-radius:0 0 0.5rem 0.5rem;background: var(--color1);}
.table td{background: var(--colorwt); padding: 0.3rem 0;}
.table-radius_lb{border-radius:0 0 0 0.3rem; }
.table-radius_rb{border-radius:0 0 0.3rem 0;}

/*個別調整--------------------*/
/*navi　ナビ*/
ul.navi{max-width: 80%; margin: 0 auto; padding-bottom: 1.5rem;}
/*ul.navi > li{min-width: calc((100% - 8vw)/2); max-width: 100%; flex-basis: calc(var(--multiplier) * 999);}*/
ul.navi > li.btn{ margin-top:1rem;}

/*お買い得品エリア※イレギュラーが多いので色はindex.htmlに直書き*/
#okaidoku .okaidoku-title{background: var(--color_oki_bgl); width: clumb(320px, 1240px, 100%);}
#okaidoku .okaidoku-item picture{display: inline-block; width: clamp(320px, 100%, 1240px); margin: 0 auto;}
#okaidoku .okaidoku-item picture img:hover{opacity: 0.7;}
#okaidoku .okaidoku-btn {width: clamp(320px, 700px, 100%); margin: 1rem auto;}

/*商品掲載エリア*/
#resultBox>ul>li:nth-child(n + 6) { display: none; }
#resultBox>ul {display: flex; flex-wrap: wrap; justify-content: space-between; }
.incitem p {text-align: center;}
.incitem img {width: 10px; height: 10px; margin-right: 3px;}
/*商品読込画像拡大防止*/
#resultBox.type1 .appraisal img,#resultBox.type2 .appraisal img{width:auto;}
/*一列5商品時*/
#resultBox.type1 > ul > li{width: 240px; padding: 30px 8px 0;}

/*erabu & kakunin & maker リンクボタン*/ 
.btn{width: min(90%, 500px); display: flex; justify-content: center; align-items: center; background: var(--color2d); margin: auto auto; padding: 1rem 0; border-radius:0.5rem;}
.btn a,.btn p{ width: 100%; height:100%; color: var(--colorwt); display: flex; justify-content: center; align-items: center; padding: 0 1.5rem;}   
.btn:hover {background: var(--color9d); }
.btn svg{width:20px; height:20px; fill:white; display: inline-block; vertical-align: middle;}


/*erabu エアコンの選び方 カーソル制御*/ 
.pittari,.check > *{cursor: pointer; }
/* erabu エアコンの選び方 モデル選択ボタン */
.itembtn_ew {margin: 0 auto 10px;border: 1px solid gray;width: 15em;border-radius: 15px;padding: 5px;}
.selectitem_ew h3{margin-bottom: 15px;}
.selectitem_ew a {text-decoration: none;}
.selectitem_ew a:link,.selectitem_ew a:visited,.selectitem_ew a:hover,.selectitem_ew a:active,.modeltitle_ew {color: gray; font-weight: normal;}
p.modeltitle_ew {margin-bottom: 25px;margin-top: -15px;color: gray;font-size: 1.4em;}
div.selectitem_ew {background-color: #fff;padding: 40px;max-width: 500px;text-align: center;padding-bottom: 35px;}

/*erabu エアコンの選び方 フィルターお掃除機能&内部洗浄 矢印*/
.tri-b{width: 100%;}
.tri-b::before{
    position: absolute;
    top: -32px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    content: '';
    border-width: 20px 32px 0 32px ;
    border-style: solid;
    border-color:var(--color2) transparent transparent transparent;}

/*kakunin 購入前の確認 取り付け前 h2チェックマーク*/
.checmark::before{content:url(../img/checkmark.png); display: inline-block; width: 40px; height: 44px; margin:0 0.5rem 0 0; position: relative; top:10px;}

/*kakunin 折り畳み範囲*/
.toggle summary{list-style: none; }
.toggle summary::-webkit-details-marker{display: none;}

/*kakunin 折り畳み範囲 購入前の確認 取り付け前 h2チェックマーク*/
.toggle summary h2 > .checmark::before{content:url(../img/checkmark-off.png);}
.toggle details[open] .checmark::before{content:url(../img/checkmark.png);}

.toggle details > div:last-of-type{margin-bottom: 2rem;}


/*kakunin 購入前の確認 c3 室内配管 隠ぺい配管 吹き出し矢印*/
.tri-l{position: relative;}
.tri-l::before{
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    content: '';
    border-width:0 12px 12px 12px ;
    border-style: solid;
    border-color: transparent transparent var(--color1) transparent;}

/*original オリジナルモデルの機能紹介 安心 03　長期修理保証*/
.anshin03{position: relative; height: 50px;}
.anshin03 span{margin-left: 1rem; padding:0.2rem 0 0.2rem 4rem; display: inline-block; width: calc(100% - 1rem);}
.anshin03::before{content:url(../img/06.png); display: inline-block; width: 73px; height: 73px; position: absolute; top: -50%; z-index: 1;}
.anshin03-1{flex-basis: 50%;}
.anshin03-1-1{width: max(70%, min(100%, 300px));}

.anshin03-3{position: relative; border-top:1px var(--color1) solid; padding-bottom: 0}
.anshin03-3::before{content:url(../img/07.png); display: inline-block; width: 96px; height: 77px; position: absolute; bottom: 20%; z-index: 1;}
.anshin03-3::after{content:url(../img/08.png); display: inline-block; width: 108px; height: 129px; position: absolute; right:2%; bottom: 0; z-index: 1;}

/*cleaning クリーニング*/
.cleaning ul{width: 90%; margin: auto auto;}
.cleaning li{width: 50%; text-align: center; padding: 1rem; border: 1px solid #ccc; font-weight: bold;}
.cleaning .h3{border: 3px solid var(--color6); padding: 0.5rem ; color:var(--color6); line-height: 1; }
.cleaning .clean_btn{background: #284DB4; position: relative;}
.cleaning .clean_btn:hover{opacity:  0.7;}
.cleaning .clean_btn a{padding: 0.8rem 1.8rem 0.8rem 0.8rem ;}
.cleaning .clean_btn a:before{content: "";
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(
45deg)translateY(-50%);
    position: absolute;
    top: 50%;
    right: 1rem;
}

/*個別調整--------------------*/


/* メディアクエリ PC--------------------*/
@media all and (min-width: 751px){
.pc-hide{display: none;}
.fx-2box > :not(div, .navi>li){margin-left:2vw;}
.fx-2box > :not(:nth-of-type(odd)){margin-left:2vw;}

/*メディアクエリ PC  order */
.order1{order: 1;}
.order2{order: 2;}
.b_lt-thin{border-left: 1px #000 solid; padding-left:1px;}
    
/*メディアクエリ PC kakunin 購入前の確認 c4 室外機設置 別途工事設置例*/
.snap .snapin{display: flex; flex-direction: column;}
.snap .snapin p{margin-bottom: 0.5rem}
.snap .snapin .snapimg{margin-top: auto;}    

/*メディアクエリ PC kakunin 購入前の確認 c4 室外機設置 アングル */  
.angle {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2);
grid-column-gap: 1vw;}
.angle .div1 { grid-area: 1 / 1 / 2 / 3; }
.angle .div2 { grid-area: 2 / 1 / 3 / 2; }
.angle .div3 { grid-area: 2 / 2 / 3 / 3; }
.angle .div4 { grid-area: 1 / 3 / 3 / 4; }
    
}

/* メディアクエリ sp--------------------*/
@media all and (max-width: 750px){
.wrap section{width: 96%; margin-left: auto; margin-right: auto;}
.sp-hide{display: none;}
.fx-2box > :not(div){margin-top:2vw;}
    
/*メディアクエリ sp 下部貼りつきメニュー*/ 
.menu{height: 30vw;}
/*メディアクエリ sp 下部貼りつきメニュー用flex*/
.fx-6box > *{min-width: calc((100% - 1vw)/3); max-width: 50%; flex-basis: calc(var(--multiplier) * 999); margin: 0;}
/*.fx-6box > *:first-of-type {margin-left: 0;}*/
.fx-6box > *:first-of-type {margin: auto; min-width:calc((100% - 1vw)/1);}
.fx-6box > *:last-of-type {margin-right: 0;}
	}


/*エフェクト制御--------------------*/
.fade-in{opacity: 0;transition-duration: 500ms;transition-property: opacity, transform;}
.fade-in-up{transform: translate(0, 50px);}
.fade-in-down{transform: translate(0, -50px);}
.fade-in-left{transform: translate(-50px, 0);}
.fade-in-right{transform: translate(50px, 0);}

/*スクロール制御*/
.scroll-in{opacity: 1; transform: translate(0, 0);}