@charset "UTF-8";
/* =============================================
                    CONTENTS
============================================= */
sup{ font-size: 70%; vertical-align: top; position: relative; top: -0.1em;}
.en{ font-family: "Roboto Condensed", sans-serif; font-weight: 700;}
.tieup20260602{ background: #000;}
/* contents */
.btn-shop a{ background: #0071be; box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.25); font-weight: 700; line-height: 1.3; color: #fff; text-align: center; text-decoration: none; display: block; cursor: pointer;}
.btn-shop a span{ display: inline-block; position: relative;}
.btn-shop a .arrow::after{
    content: "\f105";
    font-family: FontAwesome;
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
}
#main .mv .swiper-slide{ background: none !important;}
#main .box .text p{ color: #fff;}
#main .box nav .anchor-list{ display: flex; flex-wrap: wrap;}
#main .box nav .anchor-list li{ border-right: 1px solid #000;}
#main .box nav .anchor-list li a{ background: #2e2a2a; text-align: center; text-decoration: none; display: block;}
#main .box nav .anchor-list li a .tit{ font-weight: 700; line-height: 1.3; color: #fff;}
#main .box nav .anchor-list li a .en{ font-weight: 700; color: #00aef8;}
#main .box nav .anchor-list li a div{ background: #00aef8; position: relative;}
#main .box nav .anchor-list li a div::before{
    content: "\f105";
    font-family: FontAwesome;
    font-weight: bold;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(90deg);
}
section .tit-box{ text-align: center;}
section .tit-box h2{ font-weight: 900; line-height: 1.3; color: #fff;}
section .tit-box .en{ font-weight: 700; line-height: 1.3; color: #00aef8; border-bottom: 2px solid #00aef8; display: inline-block;}
section .stit-box{ display: flex; align-items: center; justify-content: center; width: 100%; margin: 0 auto; text-align: center;}
section .stit-box .line{ display: flex; flex-direction: column; justify-content: space-between; flex-grow: 1; flex-shrink: 0; height: 19px;}
section .stit-box .line:first-child{ align-items: flex-end;}
section .stit-box .line:last-child{ align-items: flex-start;}
section .stit-box .line span{ background: #666; display: block; width: 100%; height: 1px;}
section .stit-box h3{ font-weight: 900; line-height: 1.3; color: #fff;}
section .stit-box h3 strong{ color: #00aef8;}
section .comment-list li:last-child{ margin-bottom: 0;}
section .comment-list li .detail p{ color: #fff;}
section .comment-list li .detail p:last-of-type{ margin-bottom: 0;}
section .comment-list li .detail p.notes{ text-align: right;}
section .comment-list li.text{ color: #fff;}
#sec01{ background: #101010 url(../img/sec01-bg.jpg) left top repeat;}
#sec01 .lineup-list{ display: flex; flex-wrap: wrap;}
#sec01 .lineup-list li{ background: #2e2a2a; border: 1px solid #393535; box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);}
#sec01 .lineup-list li h3{ font-weight: 700; color: #00aef8; text-align: center;}
#sec01 .lineup-list li .sub{ font-weight: 700; line-height: 1.3; letter-spacing: 0.025em; color: #fff; text-align: center;}
#sec01 .lineup-list li .text{ line-height: 1.6; color: #fff;}
#sec01 .lineup-list li .btn-shop{ width: 100%;}
#sec02{ background: #2e2a2a url(../img/sec02-bg.jpg) left top repeat;}
#sec02 .profile-box{ background: rgba(0, 0, 0, 0.5); border: 1px solid #393535; display: flex; align-items: center;}
#sec02 .profile-box .img{ flex-shrink: 0;}
#sec02 .profile-box .detail h3{ font-weight: 700; line-height: 1.3; color: #fff;}
#sec02 .profile-box .detail h3 span{ display: inline-block;}
#sec02 .profile-box .detail p{ color: #fff;}
#sec03{ background: #fff url(../img/sec03-bg.jpg?260603) left top repeat;}
#sec03 .tit-box h2{ color: #000;}
#sec03 .tit-box .en{ color: #008bc6; border-bottom: 2px solid #008bc6;}
#sec03 .stit-box h3{ color: #000;}
#sec03 .stit-box h3 strong{ color: #008bc6;}
#sec03 .impression-list li{ background: #fff; border: 1px solid #eee;}
#sec03 .impression-list li:last-child{ margin-bottom: 0;}
#sec03 .impression-list li .row .detail .catch{ font-weight: 700; line-height: 1.3; color: #000;}
#sec03 .impression-list li .row .detail h4{ font-weight: 700; color: #008bc6;}
#sec03 .impression-list li .row .detail p{ color: #000;}
#sec03 .impression-list li.text{ color: #fff;}
footer .bg{ background: #222;}

/* ==== PC ===== */
@media screen and (min-width: 768px){
/* contents */
.btn-shop{ width: 740px; margin: 0 auto;}
.btn-shop a{ font-size: 20px; border-radius: 41px; padding: 22px 0;}
.btn-shop a:hover{ transition: .4s; box-shadow: none;}
.btn-shop a .arrow::after{ font-size: 20px; right: -20px;}
.inner{ width: 1046px; margin: 0 auto;}
#main{ background: #000 url(../img/bg_pc.jpg?260605) center top no-repeat; padding-bottom: 60px;}
#main .mv{ padding-top: 40px; margin-bottom: 35px;}
#main .mv .inner{ position: relative;}
#main .mv .swiper{ text-align: right;}
#main .mv h1{ position: absolute; left: 0px; top: 34px;}
#main .box .text{ margin-bottom: 40px;}
#main .box .text p{ font-size: 18px; line-height: 2.0;}
#main .box nav .anchor-list li{ width: calc(100% / 4);}
#main .box nav .anchor-list li a{ padding: 13px 0;}
#main .box nav .anchor-list li a .tit{ font-size: 18px; margin-bottom: 8px;}
#main .box nav .anchor-list li a .en{ font-size: 14px; margin-bottom: 8px;}
#main .box nav .anchor-list li a div{ height: 20px;}
#main .box nav .anchor-list li a div::before{ font-size: 18px;}
section{ padding: 80px 0 100px;}
section .inner{ width: 1046px;}
section .tit-box{ margin-bottom: 40px;}
section .tit-box h2{ font-size: 46px; margin-bottom: 20px;}
section .tit-box .en{ font-size: 20px; padding-bottom: 8px;}
section .stit-box{ margin-bottom: 40px;}
section .stit-box h3{ font-size: 34px; margin: 0 20px;}
section .stit-box .line span:nth-child(2){ width: calc(100% - 20px);}
section .stit-box .line span:nth-child(3){ width: calc(100% - 40px);}
section .comment-box{ margin-bottom: 60px;}
section .comment-list li{ display: flex; align-items: center; margin-bottom: 40px;}
section .comment-list li:last-child{ flex-flow: row-reverse;}
section .comment-list li .detail{ width: 503px; margin-left: auto;}
section .comment-list li:last-child .detail{ margin-right: auto; margin-left: 0;}
section .comment-list li .detail p{ font-size: 18px; line-height: 2.0; margin-bottom: 15px;}
section .comment-list li .detail p.notes{ font-size: 14px;}
section .comment-list li.text{ font-size: 18px; line-height: 2.0; display: block;}
#sec01{ background-size: 10px;}
#sec01 .lineup-list li{ width: 246px; margin-right: auto; padding: 10px 10px 20px;}
#sec01 .lineup-list li:last-child{ margin-right: 0;}
#sec01 .lineup-list li .img{ margin-bottom: 10px;}
#sec01 .lineup-list li h3{ font-size: 20px; margin-bottom: 8px;}
#sec01 .lineup-list li .sub{ font-size: 14px; margin-bottom: 5px;}
#sec01 .lineup-list li .text{ font-size: 12px; margin-bottom: 10px;}
#sec01 .lineup-list li .btn-shop a{ font-size: 14px; padding: 6px 0;}
#sec02{ background-size: 1px;}
#sec02 .profile-box{ width: 846px; padding: 30px; margin: 0 auto 60px;}
#sec02 .profile-box .detail{ margin-left: 20px;}
#sec02 .profile-box .detail h3{ font-size: 24px; margin-bottom: 12px;}
#sec02 .profile-box .detail h3 span{ font-size: 16px; margin-left: 5px;}
#sec02 .profile-box .detail p{ font-size: 16px; line-height: 2.0;}
#sec03{ background-size: 12px;}
#sec03 .impression-list li{ padding: 40px; margin-bottom: 40px;}
#sec03 .impression-list li .row{ display: flex; align-items: center; margin-bottom: 40px;}
#sec03 .impression-list li .row .detail{ width: 463px; margin-left: auto;}
#sec03 .impression-list li .row .detail .catch{ font-size: 22px; margin-bottom: 15px;}
#sec03 .impression-list li .row .detail h4{ font-size: 40px; margin-bottom: 10px;}
#sec03 .impression-list li .row .detail p{ font-size: 16px; line-height: 2.0;}
#sec04{ background: #000 url(../img/bg_pc.jpg?260605) center top no-repeat;}
}

/* ==== SP ===== */
@media screen and (max-width: 767px){
body.fixed{ height: 100%; overflow: hidden;}
header{ position: relative; z-index: 200;}
header .g-nav{ width: 100vw;}
/* contents */
.btn-shop a{ font-size: 17px; padding: 10px 0 12px; border-radius: 60px;}
.btn-shop a .arrow::after{ font-size: 16px; right: -15px;}
#main{ background: #000 url(../img/bg_sp.jpg?260605) center top no-repeat; background-size: 100%; padding-bottom: 30px;}
#main .mv .inner{ padding: 0 10px;}
#main .mv{ padding-top: 20px; margin-bottom: 15px;}

#main .mv h1{ padding: 0 15px; margin-top: -15px; position: relative; z-index: 10;}
#main .box .inner{ padding: 0 20px;}
#main .box .text{ margin-bottom: 20px;}
#main .box .text p{ font-size: 17px; line-height: 1.8;}
#main .box nav .anchor-list li{ width: calc(100% / 2); border-bottom: 1px solid #000;}
#main .box nav .anchor-list li a{ padding: 10px 0;}
#main .box nav .anchor-list li a .tit{ font-size: 14px; margin-bottom: 8px;}
#main .box nav .anchor-list li a .en{ font-size: 12px; margin-bottom: 8px;}
#main .box nav .anchor-list li a div{ height: 16px;}
#main .box nav .anchor-list li a div::before{ font-size: 14px;}
section{ padding: 30px 0 50px;}
section .inner{ padding: 0 20px;}
section .tit-box{ margin-bottom: 25px;}
section .tit-box h2{ font-size: 28px; margin-bottom: 10px;}
section .tit-box .en{ font-size: 17px; padding-bottom: 5px;}
section .stit-box{ margin-bottom: 20px;}
section .stit-box h3{ font-size: 22px; margin: 0 5px;}
section .stit-box .line span:nth-child(2){ width: calc(100% - 5px);}
section .stit-box .line span:nth-child(3){ width: calc(100% - 10px);}
section .comment-box{ margin-bottom: 30px;}
section .comment-list li{ margin-bottom: 20px;}
section .comment-list li .img{ margin-bottom: 10px;}
section .comment-list li .detail p{ font-size: 17px; line-height: 1.8; margin-bottom: 5px;}
section .comment-list li .detail p.notes{ font-size: 14px;}
section .comment-list li.text{ font-size: 17px; line-height: 1.8;}
#sec01{ background-size: 10px;}
#sec01 .lineup-list li{ width: 49%; padding: 5px 5px 15px; margin: 0 auto 10px 0;}
#sec01 .lineup-list li:nth-child(2n){ margin-right: 0;}
#sec01 .lineup-list li .img{ margin-bottom: 8px;}
#sec01 .lineup-list li h3{ font-size: 17px; margin-bottom: 5px;}
#sec01 .lineup-list li .sub{ font-size: 14px; margin-bottom: 5px;}
#sec01 .lineup-list li .text{ font-size: 12px; margin-bottom: 5px;}
#sec01 .lineup-list li .btn-shop a{ font-size: 12px; padding: 6px 0;}
#sec01 .lineup-list li .btn-shop a .arrow::after{ font-size: 12px; right: -10px;}
#sec02{ background-size: 1px;}
#sec02 .profile-box{ padding: 15px; margin-bottom: 30px;}
#sec02 .profile-box .img{ width: 75px;}
#sec02 .profile-box .detail{ margin-left: 10px;}
#sec02 .profile-box .detail h3{ font-size: 20px; line-height: 1.1; margin-bottom: 6px;}
#sec02 .profile-box .detail h3 span{ font-size: 14px; margin-left: -5px;}
#sec02 .profile-box .detail p{ font-size: 14px; line-height: 1.6;}
#sec03{ background-size: 12px;}
#sec03 .impression-list li{ padding: 15px 15px 20px; margin-bottom: 20px;}
#sec03 .impression-list li .row{  margin-bottom: 15px;}
#sec03 .impression-list li .row .img{ margin-bottom: 10px;}
#sec03 .impression-list li .row .detail .catch{ font-size: 20px; text-align: center; margin-bottom: 10px;}
#sec03 .impression-list li .row .detail h4{ font-size: 30px; text-align: center; margin-bottom: 5px;}
#sec03 .impression-list li .row .detail p{ font-size: 16px; line-height: 1.8;}
#sec04{ background: #000 url(../img/bg_sp.jpg?260605) center top no-repeat; background-size: 100%;}
}