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

#contents_wrap{width:100%;}
img{width:100%;}

#lp{width:100%; max-width:1200px; margin:0 auto; text-align:center;}

/*メイン画像*/
#main{margin:0 auto;}
.pc{display:block; width:80%; margin:0 auto;}
.sp{display:none;}

/*コンテンツ下部_ボタン*/
.tab_wrap{width:100%; margin:5% auto;}
input[type="radio"]{display:none;}
.tab_area{font-size:0; margin:0 10px;}
.tab_area label{width:20%; display:inline-block; text-align:center; font-family: 'Oswald', sans-serif; margin-bottom:5%;}
.tab_area label img{width:50%; margin-bottom:5%;}
.tab_area label h4{font-size:13px; letter-spacing:2px;}
.tab_area label h4 b{font-size:20px; line-height:150%;}
.tab_area label:hover{opacity:0.5;}

/*コンテンツ下部_表示内容*/
.panel_area{overflow:hidden;}
.tab_panel{width:100%; display:none; margin:0 auto;}
.tab_panel p{font-size:14px; letter-spacing:1px; text-align:center;}

.profile{background-color:#DCDCDC; margin:0 auto; overflow:hidden; padding:5%;}
.pfimg{width:20%; float:left; margin-right:5%;}
.pfinfo{width:30%; float:left; text-align:left;}
.pfinfo h4{font-size:18px; letter-spacing:2px; font-family: 'Oswald', sans-serif;}
.pfinfo h4 b{font-size:25px; line-height:150%;}
p.speck{text-align:left; margin-top:10%; font-family: 'Noto Sans JP', sans-serif; font-weight:500; line-height:130%;}
p.infotext{margin:5% 0; font-size:13px; line-height:150%; text-align:justify; text-justify:inter-ideograph; font-family: 'Noto Sans JP', sans-serif; font-weight:400;}
.pfinfo a img{width:8%; margin-right:3%;}
 
/*コンテンツ下部_表示切り替え*/
#tab1:checked ~ .panel_area #panel1{display:block;}
#tab2:checked ~ .panel_area #panel2{display:block;}
#tab3:checked ~ .panel_area #panel3{display:block;}
#tab4:checked ~ .panel_area #panel4{display:block;}
#tab5:checked ~ .panel_area #panel5{display:block;}

 
/*モーダル*/
.inner h5{border-bottom:1px solid #000; font-family:'Oswald', sans-serif; width:10%; padding-bottom:1%; margin:5% auto 0 auto;}
.inner p {width:60%; margin:2% auto 3% auto; padding:1%; background-color:#000; color:#fff; font-family: 'Noto Sans JP', sans-serif; font-weight:400;}
.modal_trigger{width:100%; position:relative; overflow:hidden; margin-top:3%;}
.modal_trigger img{width:48%; float:left; margin:1%;}

.modal_block > p{width:100%; padding:10px; margin-bottom:3%; background:#000; color:#fff;}
.modal-content{display:flex;}
.modal-content > img{ width: 50%; object-fit: cover; max-height: 550px;}
.modal-content ul{width: 70%; padding-left: 15px;}
.modal-content ul li{width: 100%; border-bottom: 1px solid #000;}
.modal-content ul li a{display: block; width: 100%; overflow: hidden; margin: 10px 0; color: #000; text-decoration: none;}
.modal-content ul li img{width: 25%; float: left;}
.modal-content ul li p{line-height: 150%; font-size: 12px;text-align: left; padding-left: 28%;}
.modal-content ul li p b{font-weight: bold; display: block;}
.modal-content ul li p::after{content: "円（税込）";font-size: 10px;}
@-webkit-keyframes slideRightBg {
    0% {opacity: 0; left: -50%;}
    100% {opacity: 1; left: 0;}
        }
 @keyframes slideRightBg {
    0% {opacity: 0;left: -50%;}
    100% {opacity: 1; left: 0;}
        }
.modal_box{display:none; height:100%; left:0; position:fixed; top:0; width:100%; z-index:9999;}
.modal_bg{background-color:rgba(30, 30, 30, 0.9); height:100%; width:100%;}
.modal_inner{background-color:#fff; left:50%; padding:40px; position:absolute; top:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); max-width:900px;}
.modal_close{cursor:pointer; position:absolute; right:10px; top:5px; font-size:2rem;}

#other{width:80%; border:1px solid #000; margin:5% auto; padding:1%;}
#other a{color:#000; font-family: 'Noto Sans JP', sans-serif; font-weight:400;}




@media screen and (max-width: 768px) {

/*メイン画像*/
#main{margin:0 auto;}
.pc{display:none;}
.sp{display:block;}

/*コンテンツ下部_ボタン*/
.tab_wrap{width:100%; margin:5% auto;}
.tab_area {margin:40px 10px;}
.tab_area label{width:33%; font-family: 'Oswald', sans-serif;}
.tab_area label img{width:70%; margin-bottom:10%;}
.tab_area label h4{font-size:10px;}
.tab_area label h4 b{font-size:16px;}

/*コンテンツ下部_表示内容*/
.tab_panel{width:100%;}
	
.profile{padding:15% 5%;}
.pfimg{width:40%;}
.pfinfo{width:55%;}
p.infotext{font-size:10px; font-family: 'Noto Sans JP', sans-serif; font-weight:400;}
.pfinfo a img{width:15%;}
	
/*モーダル*/
.inner h5{font-family:'Oswald', sans-serif; width:25%; padding-bottom:3%; margin-top:10%;}
.inner p{width:85%; margin:4% auto 3% auto; padding:2%; font-family: 'Noto Sans JP', sans-serif; font-weight:400;}
.modal_trigger{margin-top:7%;}
.modal_trigger img{width:100%; margin:5% 0;}

.modal_inner {width: 90%; padding: 25px; max-height: 500px; overflow: hidden;}
.modal_close {top: 5px; font-size: 2.2rem;}
.modal-content > img{max-height: 300px;}
	
#other{width:80%; margin:10% auto; padding:3%;}
#other a{font-family: 'Noto Sans JP', sans-serif; font-weight:400;}
	
}