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

}
@media screen and (max-width: 950px) {
	main #sec01 .box .content .img-box { margin-bottom: 3%; }
	main #sec01 .box .content p{ font-size: 2vw; }
	main #sec01 .box .content .img-box img { width: 14%; }
	main #sec01 .box .content h2{ font-size: 4vw; padding: 15px 2px 5px; }
	main #sec01 .box .content .object-box{ width: 27%; }

	main #sec02 .box1 .right p{ left: 35px; font-size: 5vw; }
	main #sec02 .box2:before { right: -10%; top: -130px; max-width: 245px; width: 100%; height: 350px; }
	main #sec02 .box2 .left { width: 40%; padding-right: 50px; }
	main #sec02 .box2 .right{ width: 60%; }

	main #sec04 .box h2,
	main #sec02 .box h3{ margin-bottom: 20px; font-size: 2.6rem; }
	main #sec03 .box .right h2{ font-size: 2.2rem; }
	main #sec03 .box .right { padding: 40px 45px; }
	main #sec03 .box .right p{ font-size: 1.7rem; }
	main #sec03 .box .right p br{ display: none; }
	main #sec03 .box .right .rl-text{ font-size: 2.2rem; letter-spacing: 6px; }

	main #sec04{ margin-bottom: 180px; }
	main #sec04 .box2 .right:before { bottom: -25%; width: 103%; }
}


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

}

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

	.wrapper{ overflow: hidden; }
	.ipad { display: none; }

	header:before{ width: 50%; left: -60px; }
	header:after{ width: 50%; right: -60px; }
	header{ padding-top: 60px; }
	header .left{ width: 100%; }
	header .left h1{ text-align: center; }

	header.fixed{ padding-top: 19px; }
	header.fixed .left h1{ font-size: 1.3rem; text-align: left; }
	header #modalbtn{ display: none; width: 40px; height: 40px; background: #fff; border-radius: 40px; border: 1px solid var(--main-color); }
	header.fixed #modalbtn{ z-index: 999; display: block; position: fixed; top: 10px; right: 10px; }
	header.fixed #modalbtn:before{ content: ""; transition: 0.3s; position: absolute; width: 19px; height: 1px; border-radius: 2px; background: var(--main-color); top: 21px; left: 0; right: 0; margin: auto; }
	header.fixed #modalbtn:after { content: ""; transition: 0.3s; position: absolute; width: 19px; height: 1px; border-radius: 2px; background: var(--main-color); bottom: 21px; left: 0; right: 0; margin: auto; }
	header.fixed #modalbtn.active:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 18.5px; }
	header.fixed #modalbtn.active:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 18.5px; }
	header .right nav{ display: none; }
	header.fixed .right nav{ padding: 60px 0 0; transition: 0.3s; display: block; position: fixed; left: 0; top: -100vh; width: 100%; z-index: 998; }
	header.fixed .right nav ul{ display: block; }
	header.fixed .right nav li:not(:last-child){ border-bottom: 1px solid #e9e9e9; }
	header.fixed .right nav li{ margin-right: 0; position: relative; }
	header.fixed .right nav li:before{ content: ""; position: absolute; height: 20px; width: 1px; right: 25px; top: 0; bottom: 0; margin: auto; background-color: var(--main-color); }
	header.fixed .right nav li:after { content: ""; position: absolute; right: 20px; top: 0; bottom: -4px; margin: auto; transform-origin: right bottom; width: 10px; height: 1px; background-color: var(--main-color); transform: rotate(-60deg); }
	header.fixed .right nav a{ display: block; padding: 15px 20px; }
	header .right nav.active{ top: 0; background: #fff; }
	.fixed header .left{ position: fixed; z-index: 999; }

	#blackbg.active{ background: #0000007a; height: 100vh; width: 100vw; position: fixed; top: 0; left: 0; z-index: 100; }

	.fv{ padding: 135px 0 30px; }
	.fv:before{ width: 100px; height: 100px; top: -50px; }
	.fv:after{ width: 80%; background-position: top; top: 85px; }
	.fv .img-box img{ width: 50%; }

	.fv .object-box:before,
	.fv .object-box:after{ width: 43%; }
	.fv .object-box:before{ top: -60px; right: -18%; }
	.fv .object-box:after{ top: 130px; left: -15%; }

	.fv .object-box2:before,
	.fv .object-box2:after{ max-width: 60px; height: calc( 100% + 35px); bottom: -40px; max-height: calc( 100% + 35px); }
	.fv .object-box2:before{ right: -20px; }
	.fv .object-box2:after{ left: -20px; }

	.fv .text-box{ margin-bottom: 50px; position: relative; z-index: 2; }
	.fv .text-box h2{ margin-bottom: 20px; }
	.fv .img-box { margin-bottom: 30px; }

	main #sec01 { padding-bottom: 60px; }
	main #sec01 .content-box{ padding: 60px 0 0; }
	main #sec01 .content-box:before{ left: -145px; top: 0; max-width: 300px; max-height: 120px; }
	main #sec01 .content-box:after{ max-width: 300px; max-height: 120px; }
	main #sec01 .box .content{ padding-top: 19%; }
	main #sec01 .box .content .img-box img { width: 22%; }
	main #sec01 .box .content p{ font-size: 3vw; }
	main #sec01 .box .content p br{ display: block; }
	main #sec01 .box .content .img-box{ margin-bottom: 5%; }
	main #sec01 .box .content .object-box{ right: -30px; bottom: -155px; width: 30%; }
	main #sec01 .box .content h2{ font-size: 5vw; left: 13px; }

	main #sec02{ padding: 60px 0 80px; }
	main #sec02:after{ top: 6%; max-width: 300px; max-height: 120px; }
	main #sec02:before{ left: -145px; top: 47%; max-width: 300px; max-height: 120px; }
	main #sec02 h2{ margin-bottom: 35px; font-size: 15vw; }
	main #sec02 h2:before { right: -75px; top: -10px; max-width: 60px; max-height: 75px; }
	main #sec02 .box{ -ms-flex-wrap: wrap; flex-wrap: wrap; }
	main #sec02 .box1 .left{ order: 2; width: 100%; }
	main #sec02 .box1 .right{ margin-bottom: 35px; display: inline-flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; order: 1; width: 100%; }
	main #sec02 .box1 .right .min{ display: none; }
	main #sec02 .box1 .right .min2{ right: auto; left: -21px; top: 0; -ms-writing-mode: unset; writing-mode: unset; line-height: 1em; font-size: 5.5vw; padding: 9px 5px 9px 9px; letter-spacing: 4px; }
	main #sec02 .box1 .right .min2:before{ width: calc( 100% + 5px ); left: 0; top: 5px; background-image: url(../images/sec01-titlebgsp.png); background-color: #fff; background-size: cover; }
	main #sec02 .box1 .right p:nth-child(1){ top: 0; }
	main #sec02 .box1 .right p.sp{ display: block; }

	main #sec02 .box h3{ font-size: 2.4rem; margin-bottom: 20px; }
	main #sec02 .box p{ line-height: 2em; font-size: 1.4rem; }
	main #sec02 .box2 .left{ padding-right: 0; width: 100%; text-align: center; margin-bottom: 30px; }
	main #sec02 .box2 .left img{ width: 60%; }
	main #sec02 .box2 .right{ position: relative; width: 100%; }
	main #sec02 .box2 .right:before { content: ""; position: absolute; right: -30px; top: -45px; max-width: 100px; width: 100%; height: 100px; margin: auto; background: url(../images/sec02-object01.svg) no-repeat; background-size: contain; background-position: right top; }
	main #sec02 .box2:before{ content: none; }


	main #sec03 .box{ -ms-flex-wrap: wrap; flex-wrap: wrap; }
	main #sec03 .box .left{ z-index: -1; position: relative; width: 100%; padding-top: 65%; overflow: hidden; }
	main #sec03 .box .left img{ position: absolute; top: 0; width: 100%; height: 100%; object-fit: cover; }
	main #sec03 .box .right{ width: 100%; padding: 33px 30px 25px; }
	main #sec03 .box .right h2{ font-size: 1.8rem; margin-bottom: 15px; }
	main #sec03 .box .right h2 br{ display: none; }
	main #sec03 .box .right p{ font-size: 1.4rem; }
	main #sec03 .box .right p br{ display: none; }

	main #sec03 .box .right .rl-text{ right: auto; left: -21px; top: -27px; -ms-writing-mode: unset; writing-mode: unset; line-height: 1em; font-size: 3vw; padding: 9px 5px 9px 9px; letter-spacing: 4px; }
	main #sec03 .box .right .rl-text:before{ width: calc( 100% + 5px ); left: 0; top: 5px; background-image: url(../images/sec01-titlebgsp.png); background-color: #fff; background-size: cover; }

	main #sec04{ margin-bottom: 80px; }
	main #sec04 .box{ -ms-flex-wrap: wrap; flex-wrap: wrap; }
	main #sec04 .box h2{ font-size: 2.2rem; margin-bottom: 20px; }
	main #sec04 .box p{ font-size: 1.4rem; }
	main #sec04 .box1 .left{ width: 100%; padding-right: 0; margin-bottom: 30px; }
	main #sec04 .box1 .right{ width: 100%; }
	main #sec04 .box2 .right{ order: 1; width: 100%; padding-left: 0; margin-bottom: 80px; }
	main #sec04 .box2 .right:before{ bottom: -35%; width: 95%; }
	main #sec04 .box2 .left{ order: 2; text-align: center; width: 100%; }
	main #sec04 .box2 .left img{ width: 90%; }

	main #sec05 .text-box:after{ top: 28%; right: -130px; max-width: 300px; max-height: 120px; }
	main #sec05 .text-box:before{ left: -145px; top: -8%; max-width: 300px; max-height: 120px; }
	main #sec05 .text-box .bottom .message{ margin: 20px auto; width: 90%; }
	main #sec05 .text-box { padding-bottom: 50px; }
	main #sec05 .box { padding: 30px 20px 10px; }
	main #sec05 .box h2{ letter-spacing: 3px; padding-bottom: 10px; margin-bottom: 15px; font-size: 2rem; }
	main #sec05 .box .table-box table th{ font-size: 1.3rem; padding: 20px; word-break: keep-all; }
	main #sec05 .box .table-box table td{ font-size: 1.3rem; padding: 20px 20px 20px 0; }

	/*main #sec05 .map{ position: relative; width: 100%; padding-top: 65%; overflow: hidden; }
	main #sec05 .map iframe{ position: absolute; top: 0; width: 100%; height: 100%; object-fit: cover; }*/
	main #sec05 .map iframe{ height: 300px; }
	main #sec05{ padding-bottom: 120px; }

	main #sec06 .box .title-box{ margin-bottom: 20px; }
	main #sec06 .box .title-box h2{ font-size: 2.4rem; }
	main #sec06 .box .title-box a{ font-size: 1.5rem; padding: 9px 40px; }

	footer nav a:not(:last-child) { margin-right: 30px; }
	footer small{ font-size: 1.3rem; }
	footer .bg-img{ margin-top: -70px; }
	footer nav-box{ margin-bottom: 80px; }

	main #sec05:before{ left: -145px; bottom: 5%; max-width: 300px; max-height: 120px; }
	main #sec05 .text-box .top h2{ font-size: 2rem; padding: 22px 0; }
	main #sec05 .text-box .bottom h3{ font-size: 3rem; }
	main #sec05 .text-box .bottom .message { max-width: 480px; }
	main #sec05 .text-box .bottom .flex p{ font-size: 2.1rem; }

	main #sec05 .text-box .bottom .flex:before{ right: -60px; }

	main #sec06:after{ bottom: -65px; right: -130px; max-width: 300px; max-height: 120px; }
	main #sec05 .text-box .top h2:before,
	main #sec05 .text-box .top h2:after{ width: 90px; }
	main #sec05 .text-box .top { margin-bottom: 30px; }




}


@media screen and (max-width: 640px) {
	.pc{ display: none; }
	.sp{ display: block; }

	.fv .text-box h2{ font-size: 8vw; }
	.fv .text-box p{ font-size: 4vw; }

	.fv .movie-box{ display: block; }
	.fv .movie-box li { width: 100%; }
	.fv .movie-box li:not(:last-child){ margin-bottom: 15px; }

	main #sec01 ul{ padding: 15px 0; }
	main #sec01 ul li{ margin: 0 5px; }

	main #sec05 .text-box .top h2{ font-size: 3.5vw; }
	main #sec05 .text-box .bottom .flex p { font-size: 4vw; }
	main #sec05 .text-box .bottom .flex img{ margin: 0 12px; max-width: 20px; }
	main #sec01 .box .content p { font-size: 3.2vw; }
	main #sec01 .box .content .object-box{ bottom: -65px; }
	main #sec01 .box .content h2{ font-size: 5vw; left: 1px; top: -15px; }

	main #sec03 .box .right .rl-text{ font-size:  5vw; }
	main #sec05 .text-box .bottom h3{ font-size: 6vw; }

	main #sec05 .text-box .bottom .flex:before{ right: -40px; width: 32px; height: 37px; bottom: -3px; }

	main #sec05 .map iframe{ height: 250px; }


}

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

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