@charset "utf-8";
/* CSS Document */
/*====================================
Reset
====================================*/
html{
	width: 100%;
	font-size: 2.41546vw; /* 画面幅414pxの時1rem=10px */
	font-weight: 400;
}
body{
	min-width: 320px;
	line-height: 1;
	color: #000;
	background-color: #FFF;
	position: relative;
	overflow-x: hidden;
	font-family: 'Noto Sans JP',"メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: 400;
}
@media screen and (min-width: 600px) {
	html{
		font-size: 0.76923vw; /* 画面幅1300pxの時1rem=10px */
	}
}
@media screen and (min-width: 1300px) {
	html{
		font-size: 10px;
	}
}

img{
	width: 100%;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
a{
	text-decoration: none;
	color:inherit;
}
a, .slider_prev, .slider_next, .swiper-pagination-bullet,
.js--ac_btn, .js--tab_btn{
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	 outline: 0;
}
::selection {
	background: rgba(255, 234, 0, .25);
}

/*====================================
Common
====================================*/
.cmn_width,
.cmn_width2{
	margin: 0 auto;
	width: 35.4rem;
}
.anchor{
	display: block;
	width: 0;
	height: 0;
}

@media screen and (min-width: 600px) {
	.cmn_width{
		width: 110rem;
	}
	.cmn_width2{
		width: 120rem;
	}
	.anchor{
		padding-top: 5.5rem;
		margin-top: -5.5rem;
	}
}

/* 共通テキスト
--------------------------------------*/
.txt--cmn{
	font-size: 1.6rem;
	line-height: 1.87;
}
.fw700{
	font-weight: 700;
}

/* 共通タイトル
--------------------------------------*/
.ttl--cmn1{
	font-weight: 700;
	font-size: 2.4rem;
	position: relative;
	padding-bottom: 2rem;
	margin-bottom: 3rem;
	text-align: center;
}
.ttl--cmn1:before{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	width: 5rem;
	height: 0.2rem;
	background-color: #000;
	bottom: 0;
	left: calc(50% - 2.5rem);
}

/* ポップアップ
--------------------------------------*/
.cmn_popup{
	display: none;
	z-index:10002;
	position: relative;
}
.cmn_popup .popup_overlay{
	background-color: rgba(0,0,0,.8);
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	opacity: 0;
	transition: opacity 0.5s;
}
.cmn_popup .popup_container{
	margin:0 auto;
	box-sizing:border-box;
	box-sizing: border-box;
	position: fixed;
	top: 50%;
	left: 50%;
	opacity: 0;
	transform: translate(-50%,-50%);
	transition: 0.3s;
}
.cmn_popup.is--active .popup_overlay{
	opacity: 1;
	transition: opacity 0.3s;
}
.cmn_popup.is--active .popup_container{
	opacity: 1;
	transform: translate(-50%,-50%);
}
.cmn_popup .close{
	position: absolute;
	transition:all 0.3s ease;
	display:block;
	cursor:pointer;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	width: 2.5rem;
	height: 2.5rem;
	top: -4.5rem;
	right: 3rem;
	z-index: 2;
}
.cmn_popup .close:before,
.cmn_popup .close:after{
	content:'';
	display: block;
	position: absolute;
	pointer-events: none;
	height: 0.2rem;
	width: 3.4rem;
	top: 50%;
	left: 50%;
	background-color: #fff;
	pointer-events: none;
}
.cmn_popup .close:before{
	transform:translate(-50%,-50%) rotate(-45deg);
}
.cmn_popup .close:after{
	transform:translate(-50%,-50%) rotate(45deg);
}
.cmn_popup .popup_inner{
	display: none;
	max-height: calc(100vh - 12rem);
}

@media screen and (max-width: 599px) {
	.cmn_popup .popup_container{
		width: 100%;
	}
	.cmn_popup .popup_img_scroll{
		overflow-x: scroll;
		width: 100%;
	}
	.cmn_popup .popup_img{
		width: 69.2rem;
		padding: 0 3rem;
	}
}

/* effect
--------------------------------------*/
.effect--fadein,
.effect--fadein_to_up{
	opacity: 0;
}
.effect--fadein_to_up{
	transform: translateY(2.5rem);
}
.effect--fadein.is--scrolled,
.effect--fadein_to_up.is--scrolled{
	opacity: 1;
}
.effect--fadein.is--scrolled{
	transition: opacity 1s ease-out;
	transition-delay: .2s;
}
.effect--fadein_to_up.is--scrolled{
	transform: translate(0);
	transition: opacity 1s ease-out, transform 1s ease-out;
	transition-delay: .2s;
}

/*====================================
header
====================================*/
header{
	position: relative;
	z-index: 1000;
	height: 7.2rem;
}
.header_logo_wrap{
	box-sizing: border-box;
	padding-top: 3rem;
}
.header_logo{
	display: block;
}

@media screen and (max-width: 599px) {
	.header_logo{
		width: 16.72rem;
	}
}

@media screen and (min-width: 600px) {
	header{
		height: 11rem;
	}
	.header_logo_wrap{
		padding-top: 5rem;
		display: flex;
		justify-content: flex-end;
	}
	.header_logo{
		height: 6rem;
		transition: opacity .3s ease;
	}
	a.header_logo:hover{
		opacity: .7;
	}
	.header_logo img{
		width: auto;
		height: 100%;
	}
}

/* gnav
--------------------------------------*/
.gnav_wrap{
	padding-top: 4rem;
}
.gnav{
	box-sizing: border-box;
	background-color: #fff;
	width: 100%;
	z-index: 100;
	padding-top: 1.5rem;
	padding-bottom: 1rem;
}
.gnav.is--fix{
	position: fixed;
	top: 0;
	left: 0;
}
.gnav_inner{
	display: flex;
	justify-content: center;
}
.gnav_item:not(:last-child){
	margin-right: 7.5rem;
}
.gnav_item a{
	position: relative;
	display: block;
	padding-bottom: 1rem;
	font-size: 1.8rem;
	font-weight: 700;
}
.gnav_item a:after{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	width: 0;
	height: 0.2rem;
	background-color: #000;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	transition: width .3s ease;
}
.gnav_item a:hover:after{
	width: 100%;
}

@media screen and (max-width: 599px) {
	.gnav_wrap,
	.gnav{
		display: none;
	}
}

/* ハンバーガーボタン
--------------------------------------*/
.hamburger_btn{
	position: fixed;
	top: 1.5rem;
	right: 1.5rem;
	width: 5rem;
	height: 5rem;
	z-index: 2001;
}
.hamburger_btn .hamburger_inner{
	display: block;
	position: absolute;
	width: 2.4rem;
	height: 1.8rem;
	top: 1.6rem;
	left: 1.3rem;
	transition: transform 0.35s ease;
}
.hamburger_btn.is--open .hamburger_inner{
	transform: rotate(360deg);
}
.hamburger_btn span{
	position: absolute;
	top: 0;
	right: 0;
	width: 2.4rem;
	height:0.2rem;
	background-color: #fff;
	transition: transform 0.35s ease, width 0.35s ease, opacity 0.35s ease, background 0.35s ease;
}
.hamburger_btn.is--scrolled span{
	background-color: #000;
}
.hamburger_btn.is--open span{
	width: 2.5rem;
	background-color: #fff !important;
}
.hamburger_btn.is--open span:first-child{
	transform:translateY(0.8rem) rotate(-45deg);
}
.hamburger_btn span:nth-child(2){
	top: 0.8rem;
}
.hamburger_btn.is--open span:nth-child(2){
	opacity: 0;
}
.hamburger_btn span:last-child{
	top: 1.6rem;
}
.hamburger_btn.is--open span:last-child{
	transform:translateY(-0.8rem) rotate(45deg);
}

@media screen and (min-width: 600px) {
	.hamburger_btn{
		display: none;
	}
}

/*===============================
hamburger menu
===============================*/
#hamburger_menu{
	z-index:1001;
	position: fixed;
	box-sizing: border-box;
	top: 0;
	right: -24rem;
	width: 24rem;
	height: 100vh;
	padding-top: 12.7rem;
	background-color: #484B4D;
	transition: transform .35s ease;
}
#hamburger_menu.is--open{
	transform: translateX(-24rem);
}
#hamburger_menu .menu_inner{
	overflow-y: scroll;
	max-height: calc(100vh - 12.7rem);
	padding-bottom: 5rem;
	box-sizing: border-box;
}
#hamburger_menu .hamburger_nav{
	padding-left: 7.8rem;
	overflow: hidden;
}
#hamburger_menu .hamburger_nav_item{
	opacity: 0;
	transform: translateX(3rem);
}
#hamburger_menu.is--open .hamburger_nav_item{
	opacity: 1;
	transform: translateX(0);
	transition: opacity .3s ease, transform .5s ease;
	transition-delay: .35s;
}
#hamburger_menu .hamburger_nav_item:not(:last-child){
	margin-bottom: 7rem;
}
#hamburger_menu .hamburger_nav_item_txt{
	color: #fff;
	font-size: 1.8rem;
	font-weight: 700;
}

/* 背景
--------------------------------------*/
.hamburger_layer{
	position: fixed;
	width: 100vw;
	height: 100vh;
	top: 0;
	left: 0;
	z-index:1000;
	pointer-events: none;
	transition:opacity .25s ease;
	opacity: 0;
}
.hamburger_layer.is--open{
	pointer-events: auto;
	opacity: 1;
}

@media screen and (min-width: 600px) {
	#hamburger_menu,
	.hamburger_layer{
		display: none;
	}
}

/*===============================
footer
===============================*/
footer{
	position: relative;
	padding-top: 7.5rem;
	padding-bottom: 10rem;
}
footer .copyright{
	font-size: 1rem;
}

@media screen and (min-width: 600px) {
	footer{
		padding-top: 15rem;
		padding-bottom: 15rem;
	}
	footer .copyright{
		text-align: center;
	}
}

/* to_top
--------------------------------------*/
.js--to_top{
	width: 3.4rem;
	height: 2rem;
	position: fixed;
	right: 2rem;
	bottom: 5rem;
	z-index: 50;
}
.js--to_top a{
	display: block;
	box-sizing: border-box;
	position: relative;
	width: 100%;
	height: 100%;
}
.js--to_top a:before{
	content:'';
	display: block;
	position: absolute;
	pointer-events: none;
	box-sizing: border-box;
	width: 2.5rem;
	height: 2.5rem;
	border-top: solid 0.2rem #000;
	border-right: solid 0.2rem #000;
	top: 50%;
	left:50%;
  transform: translate(-48%, -20%) rotate(-45deg);
}

@media screen and (min-width: 600px) {
	.js--to_top{
		right: 5rem;
	}
	.js--to_top a{
		transition: opacity .3s ease;
	}
	.js--to_top a:hover{
		opacity: .7;
	}
}


/*====================================
form
====================================*/
input, textarea, button, label, select, .btn_setaddress{
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	 outline: 0;
}

/* テーブル */
.cmn_form .form_tbl{
	width: 100%;
}
.cmn_form th,
.cmn_form td{
	box-sizing: border-box;
	display: block;
}
.cmn_form th{
	font-size: 1.8rem;
	padding-bottom: 2rem;
}
.cmn_form tr:not(:last-child) td{
	padding-bottom: 3.2rem;
}

@media screen and (min-width: 600px) {
	.cmn_form tr:not(:last-child) td{
		padding-bottom: 5rem;
	}
}

/* 必須 */
.cmn_form .req_wrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.cmn_form .req_wrap .req{
	font-size: 1.3rem;
}

/* エラー */
.cmn_form .anchor{
	padding-top: 10rem;
	margin-top: -10rem;
}
.cmn_form .error_message{
	color:#FF0000;
	margin-bottom: 2rem;
	line-height: 1.5;
}

/* input */
.cmn_form input[type=text],
.cmn_form input[type="tel"],
.cmn_form input[type="email"],
.cmn_form textarea{
	appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
	box-sizing: border-box;
	border: none;
	background-color: #E8E8E8;
	width: 100%;
	padding: 1.5rem 3rem;
}
.cmn_form input[type=text],
.cmn_form input[type="tel"],
.cmn_form input[type="email"]{
	height: 6rem;
}

/* select */
.cmn_select_wrap,
.cmn_select_wrap select{
	width: 24rem;
	height: 6rem;
}
.cmn_select_wrap{
	position: relative;
	background-color: #E8E8E8;
}
.cmn_select_wrap select{
	cursor: pointer;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	padding: 1.5rem 3rem;
}
.cmn_select_wrap:after{
	content:'';
	display: block;
	position: absolute;
	pointer-events: none;
	box-sizing: border-box;
	top: 50%;
	right: 1.1rem;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1.7rem 1rem 0 1rem;
	border-color: #484B4D transparent transparent transparent;
}
.cmn_select_wrap select::-ms-expand{
	display: none;
}


/* 送信ボタン
--------------------------------------*/
.cmn_form .submit_box{
	margin-top: 6rem;
}
.cmn_form .btn_wrap{
	position: relative;
	width: 29.4rem;
	height: 6rem;
	color: #fff;
	background-color: #000000;
	font-size: 1.8rem;
	margin: 0 auto;
	transition: opacity .3s ease;
}
.cmn_form .form_btn{
	outline: none;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance: none;
	background: none;
	border: none;
	padding: 0;
	display: block;
	position: relative;
	text-align: center;
	cursor: pointer;
	line-height: 1;
	z-index: 3;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	color: #fff;
}
.cmn_form input[type="submit"]::-webkit-search-decoration{
	display: none;
}
.cmn_form input[type="submit"]::focus{
  outline-offset: -2px;
}

@media screen and (min-width: 600px) {
	.cmn_form .submit_box{
		margin-top: 10rem;
	}
	.cmn_form .submit_box .btn_wrap{
		width: 30rem;
		height: 8rem;
	}
	.cmn_form .submit_box .btn_wrap:hover{
		opacity: .7;
	}
}

/*====================================
top
====================================*/
/* main
--------------------------------------*/
#top .sec_main{
	margin-top: -7.2rem;
	position: relative;
	width: 100%;
}
#top .sec_main .catch{
	display: block;
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 1.1rem;
	opacity: 0;
}
body.is--loaded #top .sec_main .catch{
	opacity: 1;
	transition: opacity .6s ease;
	transition-delay: .3s;
}

@media screen and (min-width: 600px) {
	#top .sec_main{
		margin-top: -11rem;
		background: url(../img/main-bg-pc.jpg) no-repeat center center;
		background-size: cover;
		height: 80rem;
	}
	#top .sec_main .disp--sp{
		display: none;
	}
	#top .sec_main .catch{
		width: 61.4rem;
		left: 2.5rem;
		bottom: 2.6rem;
	}
}
@media screen and (min-width: 600px) and (max-height: 799px) {
	#top .sec_main{
		height: 100vh;
	}
	#top .sec_main .catch{
		width: 50rem;
		bottom: 50%;
		transform: translateY(50%);
	}
}
@media screen and (min-width: 1300px) {
	#top .sec_main .catch{
		left: calc((100vw - 1300px) / 2 + 25px);
	}
}

/* concept
--------------------------------------*/
#top .sec_concept{
	padding-bottom: 14.5rem;
}
#top .sec_concept .anchor_pos{
	padding-top: 15rem;
}
#top .sec_concept .sec_ttl{
	margin-bottom: 4rem;
}
#top .sec_concept .blc_main .catch{
	margin-bottom: 2.8rem;
}
#top .sec_concept .blc_main .catch .line1{
	margin-bottom: 2.3rem;
}
#top .sec_concept .blc_main .catch .txt{
	font-size: 2.5rem;
}
#top .sec_concept .blc_main .catch .line2{
	display: flex;
	align-items: flex-end;
}
#top .sec_concept .blc_main .catch .line2 .large_txt{
	font-size: 4.2rem;
	position: relative;
}
#top .sec_concept .blc_main .catch .line2 .large_txt:after{
	content: '※';
	display: block;
	position: absolute;
	pointer-events: none;
	font-size: 1.3rem;
	top: 0.3rem;
	right: -2.7rem;
}
#top .sec_concept .blc_main .catch .kome{
	text-align: right;
	margin-top: 1rem;
	font-size: 1.3rem;
}
#top .sec_concept .blc_main .main_txt{
	text-align: center;
}
#top .sec_concept .blc_main .main_txt p:not(:last-child){
	margin-bottom: 1.5em;
}
#top .sec_concept .blc_main .box_img{
	width: 100%;
	display: flex;
	justify-content: space-between;
}
#top .sec_concept .blc_main .box_img .img1{
	width: 19.6rem;
	position: relative;
	left: -1.5rem;
}
#top .sec_concept .blc_main .box_img .img2{
	width: 18.4rem;
}
#top .sec_concept .blc_detail{
	padding-top: 15rem;
}
#top .sec_concept .detail_item_ttl{
	font-size: 2.2rem;
	padding-top: 3rem;
	padding-bottom: 2.5rem;
}

@media screen and (max-width: 1299px) {
	#top .sec_concept .blc_main .box_img{
		overflow-x: hidden;
	}
}
@media screen and (max-width: 599px) {
	#top .sec_concept .blc_main .main_txt br.disp--pc{
		display: none;
	}
	#top .sec_concept .blc_main .box_img{
		margin-top: 5rem;
	}
	#top .sec_concept .detail_item:not(:last-child){
		margin-bottom: 7.5rem;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_concept{
		padding-top: 16.7rem;
		padding-bottom: 19.5rem;
	}
	#top .sec_concept .anchor_pos{
		padding-top: 6rem;
	}
	#top .sec_concept .blc_main{
		position: relative;
	}
	#top .sec_concept .sec_ttl,
	#top .sec_concept .blc_main .box_catch{
		position: relative;
		z-index: 2;
	}
	#top .sec_concept .sec_ttl{
		margin-bottom: 7rem;
	}
	#top .sec_concept .blc_main .box_catch{
		width: 49rem;
	}
	#top .sec_concept .blc_main .catch{
		margin-bottom: 4rem;
	}
	#top .sec_concept .blc_main .catch .line1{
		margin-bottom: 1.3rem;
	}
	#top .sec_concept .blc_main .catch .txt{
		font-size: 3.6rem;
	}
	#top .sec_concept .blc_main .catch .line2 .large_txt{
		font-size: 5.6rem;
	}
	#top .sec_concept .blc_main .catch .line2 .large_txt:after{
		font-size: 1rem;
		top: 1rem;
		right: -3.3rem;
	}
	#top .sec_concept .blc_main .catch .kome{
		font-size: 1rem;
	}
	#top .sec_concept .blc_main .box_img{
		position: absolute;
		top: 0;
		left: 0;
	}
	#top .sec_concept .blc_main .box_img .img1{
		width: 34rem;
		left: -2rem;
	}
	#top .sec_concept .blc_main .box_img .img2{
		width: 32rem;
	}
	#top .sec_concept .blc_detail{
		padding-top: 19.5rem;
	}
	#top .sec_concept .detail_list{
		display: flex;
	}
	#top .sec_concept .detail_item{
		width: calc((100% - 10.4rem) / 3);
	}
	#top .sec_concept .detail_item:not(:last-child){
		margin-right: 5.2rem;
	}
}
@media screen and (min-width: 1300px) {
	#top .sec_concept .blc_main .box_img{
		width: 1300px;
		left: calc((100vw - 1300px) / 2);
	}
}

/* scene
--------------------------------------*/
#top .sec_scene{
	position: relative;
	padding-bottom: 10rem;
	color: #fff;
	background-color: #484B4D;
}
#top .sec_scene .anchor_pos{
	padding-top: 10rem;
}
#top .sec_scene .js--bg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	opacity: 0;
	mix-blend-mode: multiply;
	transition: opacity .4s ease;
}
#top .sec_scene .js--bg.is--active{
	opacity: .7;
}
body.browser--ie #top .sec_scene{
	background-color: #1D1E1E;
}
body.browser--ie #top .sec_scene .js--bg.is--active{
	opacity: .1;
}
#top .sec_scene .bg--img1{ background-image: url(../img/scene-img1.jpg); }
#top .sec_scene .bg--img2{ background-image: url(../img/scene-img2.jpg); }
#top .sec_scene .bg--img3{ background-image: url(../img/scene-img3.jpg); }
#top .sec_scene .bg--img4{ background-image: url(../img/scene-img4.jpg); }
#top .sec_scene .sec_inner{
	position: relative;
	z-index: 2;
}
#top .sec_scene .sec_ttl:before{
	background-color: #fff;
}
#top .sec_scene .lead_txt{
	margin-bottom: 5rem;
}
#top .sec_scene .tab_box{
	position: relative;
}
#top .sec_scene .tab_box .zoom_btn{
	position: relative;
	background-color: #000000;
	width: 100%;
	height: 6rem;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1.8rem;
}
#top .sec_scene .tab_box .zoom_btn:after{
	content:'';
	display: block;
	position: absolute;
	pointer-events: none;
	width: 2rem;
	height: 2rem;
	background: url(../img/icon-zoom.png) no-repeat center center;
	background-size: contain;
	right: 2.3rem;
	top: 2.1rem;
}
#top .sec_scene .tab_btn{
	position: relative;
}
#top .sec_scene .tab_btn:not(.is--active){
	cursor: pointer;
}
#top .sec_scene .tab_btn:before{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 4rem;
	background: rgba(0, 0, 0, .7);
	transition: background .4s ease-out, height .3s ease-out;
}
#top .sec_scene .tab_btn .txt{
	position: absolute;
	left: 0;
	bottom: 1rem;
	width: 100%;
	text-align: center;
	font-size: 1.6rem;
	color: #fff;
	transition: color .4s ease, bottom .3s ease, transform .3s ease;
}
#top .sec_scene .tab_btn.is--active:before{
	background: rgba(255, 234, 0, .7);
	height: 100%;
}
#top .sec_scene .tab_btn.is--active .txt{
	color: #000;
	bottom: 50%;
	transform: translateY(50%);
}

@media screen and (max-width: 599px) {
	#top .sec_scene .tab_box_wrap{
		margin-bottom: 3rem;
	}
	#top .sec_scene .tab_btn_wrap{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#top .sec_scene .tab_btn{
		width: calc((100% - 3rem) / 2);
	}
	#top .sec_scene .tab_btn:nth-child(n+3){
		margin-top: 3rem;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_scene .tab_box .zoom_btn.disp--sp,
	#top .popup--scene.disp--sp{
		display: none;
	}
	#top .sec_scene{
		padding-top: 9rem;
		padding-bottom: 15rem;
	}
	#top .sec_scene .anchor_pos{
		padding-top: 6rem;
	}
	#top .sec_scene .lead_txt{
		text-align: center;
	}
	#top .sec_scene .tab_wrap{
		display: flex;
		justify-content: space-between;
	}
	#top .sec_scene .tab_box_wrap{
		width: 95.9rem;
	}
	#top .sec_scene .tab_btn_wrap{
		width: 19.9rem;
	}
	#top .sec_scene .tab_btn:not(:last-child){
		margin-bottom: 4rem;
	}
}
@media screen and (min-width: 600px) and (max-height: 799px) {
	#top .sec_scene .sec_inner{
		width: 90rem;
	}
	#top .sec_scene .tab_box_wrap{
		width: 71.925rem;
	}
	#top .sec_scene .tab_btn_wrap{
		width: 14.925rem;
	}
	#top .sec_scene .tab_btn:not(:last-child){
		margin-bottom: 3rem;
	}
	#top .sec_scene .tab_btn:before{
		height: 3rem;
	}
	#top .sec_scene .tab_btn .txt{
		font-size: 1.2rem;
	}
}

/* color
--------------------------------------*/
#top .sec_color{
	padding-bottom: 15rem;
}
#top .sec_color .anchor_pos{
	padding-top: 15rem;
}
#top .sec_color .sec_catch{
	text-align: center;
	font-size: 2.9rem;
	margin-bottom: 5rem;
}
#top .sec_color .box_txt p:not(:last-child){
	margin-bottom: 1.5em;
}
#top .sec_color .tab_btn_wrap{
	margin-bottom: 5.5rem;
	display: flex;
	flex-wrap: wrap;
}
#top .sec_color .tab_btn{
	display: flex;
	align-items: center;
}
#top .sec_color .tab_btn:not(.is--active){
	cursor: pointer;
}
#top .sec_color .tab_btn .color{
	box-sizing: border-box;
	width: 4rem;
	height: 4rem;
	border-radius: 100%;
	margin-right: 1.2rem;
}
#top .sec_color .tab_btn[data-tab="black"] .color{
	background-color: #141617;
}
#top .sec_color .tab_btn[data-tab="cotton-white"] .color{
	border: solid 0.1rem #707070;
	background-color: #fff;
}
#top .sec_color .tab_btn[data-tab="dark-brown"] .color{
	background-color: #30241F;
}
#top .sec_color .tab_btn[data-tab="moss-green"] .color{
	background-color: #506550;
}
#top .sec_color .tab_btn .txt{
	font-size: 1.8rem;
	position: relative;
}
#top .sec_color .tab_btn .txt:after{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	width: 0;
	height: 0.2rem;
	background-color: #000;
	left: 50%;
	bottom: -1.2rem;
	transform: translateX(-50%);
	transition: width .3s ease;
}
#top .sec_color .tab_btn.is--active .txt:after{
	width: 100%;
}

@media screen and (max-width: 599px) {
	#top .sec_color .sec_catch{
		line-height: 1.55;
		width: calc(100% + 1em);
		margin-left: -0.5em;
	}
	#top .sec_color .box_txt{
		margin-top: 6rem;
	}
	#top .sec_color .tab_btn_wrap{
		justify-content: space-between;
		padding-left: 1rem;
	}
	#top .sec_color .tab_btn{
		width: 50%;
	}
	#top .sec_color .tab_btn:nth-child(odd){
		box-sizing: border-box;
		padding-right: 1rem;
	}
	#top .sec_color .tab_btn:nth-child(n+3){
		margin-top: 6rem;
	}
	#top .sec_color .tab_btn .txt{
		line-height: 1.33;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_color{
		padding-top: 14rem;
		padding-bottom: 20rem;
	}
	#top .sec_color .anchor_pos{
		padding-top: 6rem;
	}
	#top .sec_color .sec_inner{
		width: 100rem;
	}
	#top .sec_color .sec_catch{
		font-size: 3.6rem;
		margin-bottom: 9rem;
	}
	#top .sec_color .sec_catch br.disp--sp{
		display: none;
	}
	#top .sec_color .blc_main{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	#top .sec_color .blc_main .tab_box_wrap{
		width: 56.8rem;
	}
	#top .sec_color .blc_main .box_txt{
		margin-left: 9.9rem;
		width: 33.2rem;
	}
	#top .sec_color .tab_btn_wrap{
		margin-bottom: 7rem;
		justify-content: center;
	}
	#top .sec_color .tab_btn:not(:last-child){
		margin-right: 6.7rem;
	}
	#top .sec_color .tab_btn br.disp--sp{
		display: none;
	}
}

/* spec
--------------------------------------*/
#top .sec_spec_wrap{
	background-color: #484B4D;
	color: #fff;
}
#top .sec_spec_wrap .sec_ttl:before{
	background-color: #fff;
}
#top .sec_spec .anchor_pos{
	padding-top: 10rem;
}
#top .sec_spec table{
	width: 100%;
	border: solid 0.1rem #6D6F71;
}
#top .sec_spec th,
#top .sec_spec td{
	box-sizing: border-box;
	padding: 1.8rem 4rem 1.8rem 5rem;
}
#top .sec_spec th{
	background-color: #6D6F71;
}
#top .sec_spec .blc_img{
	margin-top: 4.5rem;
}

@media screen and (max-width: 599px) {
	#top .sec_spec th,
	#top .sec_spec td{
		display: block;
	}
	#top .sec_spec .blc_img .disp--pc{
		display: none;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_spec td br.disp--sp,
	#top .sec_spec .blc_img .disp--sp{
		display: none;
	}
	#top .sec_spec{
		padding-top: 8rem;
	}
	#top .sec_spec .anchor_pos{
		padding-top: 6rem;
	}
	#top .sec_spec .sec_ttl{
		margin-bottom: 4rem;
	}
	#top .sec_spec th{
		width: 36rem;
	}
	#top .sec_spec th{
		padding: 1.5rem 5rem;
	}
	#top .sec_spec td{
		padding: 1.5rem 2rem;
	}
	#top .sec_spec tr:not(:last-child) th{
		border-bottom: solid 0.1rem #484B4D;
	}
	#top .sec_spec tr:not(:last-child) td{
		border-bottom: solid 0.1rem #6D6F71;
	}
	#top .sec_spec .blc_img{
		margin-top: 8rem;
	}
}

/* option
--------------------------------------*/
#top .sec_option{
	padding-bottom: 10rem;
}
#top .sec_option .anchor_pos{
	padding-top: 11rem;
}
#top .sec_option .option_item:not(:last-child){
	margin-bottom: 4.5rem;
}
#top .sec_option .option_item .item_ttl,
#top .sec_option .option_item .price_item{
	font-size: 1.6rem;
}
#top .sec_option .option_item .small{
	font-size: 1.3rem;
}
#top .sec_option .option_item .price_item{
	display: flex;
	align-items: flex-end;
}
#top .sec_option .option_item .price_item:not(:last-child){
	margin-bottom: 2.2rem;
}
#top .sec_option .option_list:last-child .item_ttl{
	margin-bottom: 2.5rem;
}
#top .sec_option .option_item .kome{
	margin-top: 2rem;
	font-size: 1.3rem;
	line-height: 1.53;
}
#top .sec_option .blc_deatil{
	margin-top: 4rem;
	background-color: #6D6F71;
	padding: 3rem;
}

@media screen and (max-width: 599px) {
	#top .sec_option .blc_option .disp--pc{
		display: none;
	}
	#top .sec_option .sec_ttl{
		margin-bottom: 6rem;
	}
	#top .sec_option .blc_option{
		padding: 0 3rem;
	}
	#top .sec_option .option_list:not(:last-child){
		margin-bottom: 4rem;
	}
	#top .sec_option .option_item .item_ttl{
		margin-bottom: 1.8rem;
	}
	#top .sec_option .option_item .price_list:not(:last-child){
		margin-bottom: 2.2rem;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_option .blc_option .disp--sp{
		display: none;
	}
	#top .sec_option{
		padding-top: 10rem;
		padding-bottom: 15rem;
	}
	#top .sec_option .anchor_pos{
		padding-top: 6rem;
	}
	#top .sec_option .sec_inner{
		width: 101.4rem;
	}
	#top .sec_option .blc_option{
		display: flex;
		justify-content: space-between;
	}
	#top .sec_option .option_list:first-child{
		flex: 1;
	}
	#top .sec_option .option_list:first-child .option_item{
		display: flex;
	}
	#top .sec_option .option_list:first-child .option_item:not(:last-child){
		margin-bottom: 3.5rem;
	}
	#top .sec_option .option_list:last-child{
		width: 47rem;
	}
	#top .sec_option .price_list_wrap{
		display: flex;
		justify-content: space-between;
	}
	#top .sec_option .option_item .kome{
		margin-top: 2.5rem;
	}
	#top .sec_option .blc_deatil{
		margin-top: 7.5rem;
		padding: 5rem;
	}
}

/* contact
--------------------------------------*/
#top .sec_contact .anchor_pos{
	padding-top: 16rem;
}
#top .sec_contact .blc_lead{
	text-align: center;
	margin-bottom: 7rem;
}
#top .sec_contact .blc_contact{
	margin-bottom: 8rem;
}
#top .sec_contact .contact_box .box_ttl{
	display: flex;
	align-items: center;
}
#top .sec_contact .contact_box .ttl_txt{
	font-size: 2.2rem;
	margin-left: 1.3rem;
}
#top .sec_contact .contact_box.mobile .box_ttl{
	margin-bottom: 1.8rem;
}
#top .sec_contact .contact_box.mobile .ttl_icon{
	width: 2rem;
}
#top .sec_contact .contact_box.mobile .box_tel .tel{
	font-size: 4.2rem;
}
#top .sec_contact .contact_box.mobile .box_tel .txt{
	font-size: 1.3rem;
	text-align: center;
}
#top .sec_contact .contact_box.mail .box_ttl{
	margin-bottom: 3rem;
}
#top .sec_contact .contact_box.mail .ttl_icon{
	width: 3.5rem;
}

@media screen and (max-width: 599px) {
	#top .sec_contact .blc_contact .contact_box:not(:last-child){
		margin-bottom: 7rem;
	}
	#top .sec_contact .contact_box .box_ttl{
		justify-content: center;
	}
	#top .sec_contact .contact_box.mobile .box_tel .tel{
		text-align: center;
		margin-bottom: 2.3rem;
	}
	#top .sec_contact .contact_box.mobile .box_tel .txt br.disp--pc{
		display: none;
	}
	#top .sec_contact .contact_box.mail .txt{
		text-align: center;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_contact{
		padding-top: 14rem;
	}
	#top .sec_contact .anchor_pos{
		padding-top: 6rem;
	}
	#top .sec_contact .sec_inner{
		width: 80rem;
	}
	#top .sec_contact .blc_lead br.disp--sp{
		display: none;
	}
	#top .sec_contact .blc_contact{
		display: flex;
		justify-content: space-between;
	}
	#top .sec_contact .contact_box.mobile .ttl_icon{
		width: 2.1rem;
	}
	#top .sec_contact .contact_box.mobile .box_tel{
		display: flex;
		align-items: center;
	}
	#top .sec_contact .contact_box.mobile .box_tel .txt{
		padding-left: 1rem;
		line-height: 1.53;
	}
}

/*====================================
confirm
====================================*/
.sec_pagettl{
	box-sizing: border-box;
	font-size: 2.9rem;
	color: #FFF;
	text-align: center;
	width: 100%;
	height: 22rem;
	background: url(../img/main-bg-sp.jpg) no-repeat center 45%;
	background-size: cover;
	margin-top: -7.2rem;
	padding-top: 11rem;
}
@media screen and (min-width: 600px) {
	.sec_pagettl{
		font-size: 3.6rem;
		height: 40rem;
		background-image: url(../img/main-bg-pc.jpg);
		margin-top: -11rem;
		padding-top: 18rem;
	}
}

#confirm .sec_confirm{
	padding-top: 10rem;
	padding-bottom: 15rem;
}
#confirm .sec_confirm .lead_txt{
	margin-bottom: 4rem;
}

.cmn_form .confirm_submit_box form{
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 599px) {
	.cmn_form .confirm_submit_box .btn_wrap:first-child{
		margin-bottom: 3rem;
	}
}
@media screen and (min-width: 600px) {
	#confirm .sec_confirm{
		width: 80rem;
	}
	.cmn_form .confirm_submit_box .btn_wrap{
		margin: 0;
	}
	.cmn_form .confirm_submit_box{
		display: flex;
		justify-content: center;
	}
	.cmn_form .confirm_submit_box .btn_wrap:first-child{
		margin-right: 5rem;
	}
}

/*====================================
thankyou
====================================*/
#thankyou .sec_thankyou{
	padding-top: 10rem;
	padding-bottom: 15rem;
}
#thankyou .sec_thankyou .sec_ttl{
	font-size: 2rem;
	line-height: 1.5;
	margin-bottom: 3rem;
}
#thankyou .sec_thankyou .blc_txt{
	margin-bottom: 3rem;
}
#thankyou .sec_thankyou .blc_txt .mb{
	margin-bottom: 2rem;
}
#thankyou .sec_thankyou .to_top a{
	text-decoration: underline;
}

@media screen and (min-width: 600px) {
	#thankyou .sec_thankyou{
		padding-top: 9.5rem;
		padding-bottom: 11.5rem;
		display: flex;
		justify-content: center;
	}
	#thankyou .sec_thankyou .sec_inner{
		width: auto;
	}
	#thankyou .sec_thankyou .sec_ttl{
		margin-bottom: 5rem;
	}
	#thankyou .sec_thankyou .sec_ttl br.disp--sp{
		display: none;
	}
	#thankyou .sec_thankyou .to_top a:hover{
		text-decoration: none;
	}
}



/*===============================

===============================*/
/*
--------------------------------------*/
@media screen and (max-width: 599px) {
}

@media screen and (min-width: 600px) {
}
