@charset "utf-8";

/* style
   ========================================================================== */
html {
	height: 100%;
	font-family: "IBM Plex Sans JP", sans-serif;
	font-weight: 500;
}
body{background:#121a40;}
.w1450{max-width:1450px; width:100%; margin:0 auto;}
.w920{max-width:920px; width:90%; margin:0 auto;}
.w1100{max-width:1100px; width:90%; margin:0 auto;}
img{max-width:100%!important; vertical-align: bottom;}
a:hover{transition-duration: 0.2s; opacity:0.8;}
*{box-sizing:border-box;}

/*ヘッダー*/
header{
max-width:1450px;
width:100%;
margin:0 auto;
background:url(../img/kv_pc.jpg) no-repeat top center;
background-size:cover;
position:relative;
}
h2{padding-top:50px; padding-bottom:50px;}
h2 img{text-align:center; margin:0 auto;}
h1 {position: absolute; top: 0; left:5%; z-index:99;}
h1 img{ width: 200px !important; }

/*　微調整 ここから
========================================================================== */
ul li{list-style: disc; margin-left: 1.5em; padding-bottom:15px; }
.pc { display:inherit!important;}
.sp { display:none!important;}

/*メイン*/
.product_item{text-align:center!important;}
.item_img{display:inline; text-align:center!important;}
.se_01 .item_img{/*padding:0 5%;*/ position:relative; z-index:9999; }

.se_01{
color:#fff;
background:url(../img/bg01_pc.jpg) no-repeat top center;
background-size:1450px;
height:932px;
position:relative;
}

.se_02{
color:#fff;
background:url(../img/bg02_pc.jpg) no-repeat top center;
background-size:1450px;
height:872px;
}
.se_03{
color:#121a40;
background:#e1ebf6 url(../img/bg03_pc.jpg) no-repeat center center;
background-size:1450px;
height:872px;
}

.se_04{
color:#fff;
background:#e1ebf6 url(../img/bg04_pc.jpg) no-repeat center center;
background-size:1450px;
height:974px;
}

/*商品背景*/
.product_box_pc{
width:400px;
height:auto;
position:relative;
box-sizing:border-box;
}
.se_01 .product_box_pc{top:40px;}
.se_02 .product_box_pc{margin:0 0 0 auto; top:20px; border:1px solid rgba(57,123,197,0.6);}
.se_03 .product_box_pc{top:-20px; border:1px solid rgba(18,26,64,0.1);}
.se_04 .product_box_pc{margin:0 0 0 auto; border:1px solid rgba(203,212,237,0.6);}

.se_01 .se_back_pc{
background-color:rgba(18,26,64,0.63);
mix-blend-mode: overlay;
position:absolute;
width:100%;
height:100%;
border:1px solid rgba(255,255,255,0.63);
}

.se_02 .se_back_pc{
background-color:rgba(0,51,120,0.8);
mix-blend-mode: multiply;
position:absolute;
width:100%;
height:100%;
}

.se_03 .se_back_pc{
background-color:rgba(255,255,255,0.75);
position:absolute;
width:100%;
height:100%;
}

.se_04 .se_back_pc{
background-color:rgba(0,5,54,0.8);
mix-blend-mode:darken;
position:absolute;
width:100%;
height:100%;
}

.item_box{position:relative; text-align:center; padding:20px 0;}

/*se5*/
.se_05{background:#e1ebf6; padding-top:30px; padding-bottom:20px; min-height:clamp(450px,62vw,630px);}
.se_05 .product_box_pc{max-width:1050px; width:95%; margin:0 auto; position:relative;}
.se_05 .item_box{width:400px!important; background-color:rgba(255,255,255,0.75); z-index:9; position:relative; border:1px solid rgba(0,0,0,0.1);}
.se_05 .product_item{width:auto; max-width:55%; position:absolute; right:0; height:100%; display:flex; flex-direction:column; justify-content:center;}
.se_05 .product_item img{height:auto;}
.se_05 .gentei{position:absolute; top:-70px; left:-10px; width:110px;}

/*商品テキスト*/
.product_name{font-size:1.2rem; margin:15px 0; line-height:1.3;}
.product_name span{display:block;font-size:140%;}
.product_txt{font-size:0.75rem; padding-bottom:7px; font-weight:normal;}
.price_flex{
display:flex;
justify-content:center;
align-items:center;
font-size:1.2rem;
gap:5px;
font-weight:700;
}
.price_hontai{font-size:250%; }
.hontai_yen{font-size:1.8rem;}
.price_tax{font-size:1rem; font-weight:700; margin-top:10px;}
.price_tax span{font-size:150%;}

.se_01 .price_flex,.se_01 .price_tax,
.se_02 .price_flex,.se_02 .price_tax,
.se_04 .price_flex,.se_04 .price_tax{color:#ffff00;}
.se_03 .price_flex,.se_03 .price_tax,
.se_05 .price_flex,.se_05 .price_tax{color:#e23507;}

.item_list{
box-sizing:border-box;
width:90%;
margin:0 auto;
position:relative;
margin-top:30px;
margin-bottom:20px;
display:flex;
flex-direction:column;
align-items:center;
padding:40px 0 15px;
}
.set{
font-size:1.2rem;
border-radius: 30px;
display:inline-block;
padding:12px 50px 10px;
position:absolute;
top:-20px;}
.set_naiyou{text-align:left; font-size:1rem;}
.set_naiyou p{text-indent:-1em; padding-left:1em; line-height:1.3;}

.se_01 .item_list,.se_02 .item_list,.se_04 .item_list{border:1px #fff solid;}
.se_01 .set,.se_02 .set,.se_04 .set{background:#fff; color:#121a40;}
.se_03 .item_list,.se_05 .item_list{border:1px #121a40 solid;}
.se_03 .set,.se_05 .set{background:#121a40; color:#fff;}

.product_sub{font-size:0.8rem; margin:10px 0;}

/* ページトップ（丸） */
.pagetop {
    height: 60px;
    width: 60px;
    position: fixed;
    right: 20px;
    bottom: 20px;
    background: #888888;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99999;
}

.pagetop__arrow {
    height: 15px;
    width: 15px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: translateY(20%) rotate(-45deg);
}
/*　ボタン　ここから
========================================================================== */

/*ボタン*/
a.btn-yellow {
width:90%;
margin:0 auto!important;
margin-top:10px!important;
font-weight:700;
    position: relative;
    display:block;
    text-align:center;
    font-size:1.4rem;
	letter-spacing: 0.2rem;
    text-decoration: none !important;
    color: #121a40 !important;
    background: #ffff00;
    padding: 20px 0 16px;
	box-sizing:border-box;
}
.se_04 a.btn-yellow{font-size:1rem; text-align:left; padding: 13px 0 10px 20px; line-height:1.3; font-weight:600; letter-spacing:0;}

.se_03 a.btn-yellow,.se_05 a.btn-yellow{border:2px solid #121a40;}

a.btn-yellow::before,a.btn-yellow::after{
    content: "　";
    display: block;
    width: 15px;/*線の長さ*/
    height: 2px;/*線の太さ*/
    background: #121a40;/*線の色*/
    position: absolute;
    top: calc(50% - 5px);
    right:1.5em;
    border-radius: 10px;
    transform: rotate(50deg);
    transform-origin:calc(100% - 5px) 50%;
}    
a.btn-yellow::after{
    transform: rotate(-50deg);
	top:calc(50% + 2px);
}

/*販売前後*/
a.hanbai_before{background:#fff; letter-spacing:0;}
a.hanbai_before::after,a.hanbai_before::before{display:none;}
.se_04 a.hanbai_before{font-size:1.3rem; padding: 13px 0 10px; text-align:center; font-weight:700;}
a.hanbai_before span{font-size:75%; display:block;}


/*　フッター　ここから
========================================================================== */
.attention{
padding:100px 0 50px 0;
background-color:#121a40;
color:#121a40;
}

.attention_pc{
background-color:#fff;
padding:60px 15px 30px 15px;
margin-bottom:70px;
position:relative;
display:flex;
flex-direction:column;
align-items:center;
}

.attention_ttl{
width:400px;
margin:0 auto;
background:#121a40;
color:#fff;
font-size:1.5rem;
text-align:center;
padding:13px 0 10px 0;
border-radius: 30px;
border:1px solid #fff;
position:absolute;
top:-25px;
}

.footer{
color:#fff;
text-align:center;
background:#000;
font-size:0.8rem;
padding:30px 0;
}
.footer p{margin-bottom:5px;}
.footer a{color:#fff;}

footer{padding-bottom:50px;}


/*========================================================================

　スマホ表示

========================================================================== */

@media screen and (max-width: 768px) {
	
/*　style
================== */

.pb20{padding-bottom:20px;}
.pc { display:none!important; }
.sp { display:inherit!important; }
.se_back_pc,.se_05 .item_box{background:transparent!important; border:none!important;}

/*リセット*/
ul li{padding-bottom:15px; font-size:clamp(0.8rem,2.88vw,1rem); line-height:1.2;}
section{height:auto; padding-bottom:5vw;}
.product_box_pc{top:0!important; width:100%; border:none!important;}
.se_05 .product_box_pc{width:90%;}

.attention_pc{
padding:0;
margin-bottom:0;
position:static;
display:block;
}
.attention_ttl{
color:#121a40;
background-color:transparent;
padding:0;
border-radius:0px;
border:none;
position:static;
width:100%;
}

/*　ヘッダー
================== */
header{background:url(../img/kv_sp.jpg) no-repeat top center; background-size:100%; height:0; padding-bottom:66.26%; position:relative;}
h2{width:90%; position:absolute; top:50%; left:5%; transform: translateY(-50%)}
h2 img{text-align:center;}
h1{width:29%!important;}

/*　メイン
================== */
.item_img{margin-bottom:30px;}
/*.item_box{padding:15px;}*/

.se_01{
background:url(../img/bg01_sp.jpg) no-repeat top center;
background-size:100%;
height:auto;
padding-top:86vw;
}
.se_02{
background:#0f3a7a url(../img/bg02_sp.jpg) no-repeat top center;
background-size:100%;
height:auto;
padding-top:100vw;
}
.se_03{
background:#e1ebf6 url(../img/bg03_sp.jpg) no-repeat top center;
background-size:100%;
height:auto;
padding-top:92vw;
}
.se_04{
background:url(../img/bg04_sp.jpg) no-repeat top center;
background-size:100%;
height:auto;
padding-top:94vw;
}

/*se5*/
.se_05{background:#e1ebf6 url(../img/bg05_sp.png) no-repeat top center / 100%; position:relative; min-height:auto;/*clip-path:polygon(0 0, 100% 50px, 100% calc(100% - 50px), 0 100%);*/}

.se_05 .product_box_pc{position:static;}
.se_05 .item_box{width:100%!important; position:static;}
.se_05 .product_item{width:auto; max-width:100%; position:static; padding-top:10vw; right:auto; top:auto; transform: translateY(0); display:block;}
.se_05 .gentei{top:0; left:auto; right:5%; width:24%;}


/*商品テキスト*/
.product_name{font-size:clamp(1rem,4.16vw,1.5rem);}
.product_name span{display:block; padding-top:0; font-size:140%;}
.product_txt{font-size:clamp(0.6rem,2.56vw,0.9rem); padding-bottom:5px;}
.price_flex{
display:flex;
justify-content:center;
font-size:clamp(1rem,3.84vw,1.4rem);
}
.price_hontai{font-size:250%; font-weight:700;}
.hontai_yen{font-size:clamp(1.5,5.76vw,2rem);}
.price_tax{font-size:clamp(0.8rem,3.2vw,1.2rem); margin-top:5px;}
.price_tax span{font-size:200%; font-weight:700;}

.item_list{
width:100%;
margin-top:40px;
margin-bottom:20px;
padding:35px 0 10px;
}
.set{
font-size:clamp(0.9rem,3.52vw,1.3rem);
padding:10px 50px 8px;
font-weight:500;}
.set_naiyou{text-align:left; font-size:clamp(0.8rem,3.04vw,1.1rem);}
.set_naiyou p{margin-bottom:0.2rem;}


/*ボタン*/
a.btn-yellow {
font-weight:600;
font-size:clamp(1.1rem,4.48vw,1.6rem);
padding: 17px 0 13px;
letter-spacing:0.1rem;
}
.se_04 a.btn-yellow{font-size:clamp(0.8rem,3.2vw,1.2rem);}

a.btn-yellow::before,a.btn-yellow::after{
    width: 12px;/*線の長さ*/
    height: 2px;/*線の太さ*/
    right:20px;
}
.se_02 a.btn-yellow{border:2px solid #121a40;}
/*販売前後*/
.se_04 a.hanbai_before{font-size:clamp(1.1rem,4.48vw,1.6rem); padding: 20px 0 16px; font-weight:600;}
a.hanbai_before{letter-spacing: 0;}

/*フッター*/
.attention{
padding:60px 0;
background-color:#121a40;
color:#121a40;
}
.attention_box{
border-radius:15px;
background-color:#fff;
padding:3px;
}

.attention_box2{border-radius:15px;
background-color:#fff;
padding:25px 10px 10px;
border:3px solid #121a40;
}

.attention_ttl{font-size:clamp(1.3rem,4.8vw,1.6rem); text-align:center; margin-bottom:10px; font-weight:700;}

.footer{
color:#fff;
text-align:center;
background:#000;
font-size:0.7rem;
padding:30px 0;
}
.footer p{margin-bottom:5px;}
.footer a{color:#fff;}

footer{padding-bottom:50px;}

}/*end*/
