@charset "utf-8";

@media (max-width: 1830px) {
	/* main */
	.main-visual .mail-box {bottom: 60px; left: 15px;}

	/* footer */
	.scroll-top {bottom: 220px; right: 15px;}
}

@media (max-width: 1400px) {
	/* sub01 */
	.about .cont01 ul li {margin: 0 30px 40px;}
	.about .cont01 ul li:nth-child(2) {margin-top: 0;}
	.about .cont01 ul li:nth-child(3) {margin-bottom: 0;}
	.about .cont01 ul li .text-box {padding: 0 0;}
	.about .backdrop {margin: 30px auto 0;}
}

@media (max-width: 1200px) {
	/* header */
	#header {height: 100px;}
	#header .sitelogo a {top: 15px;}
	#gnb {top: 38px;}
	.gnb-open #gnb {right: 80px;}
	#gnb>ul>li {padding: 0 20px;}
	.sitemap-btn {top: 50%; margin-top: -22px;}

	/* sub04 */
	.contact .details {flex-direction: column;}
	.contact .details .btn-wrap ul {justify-content: flex-end; margin-top: 20px;}
	.contact .details .info {width: 100%; flex: auto;}
}

@media (max-width: 1024px) {
	/* header */
	#header.hide {transform:translateY(0);}
	#header .sitelogo a {top: 20px; width: 200px; height: 61px; background-size: 200px auto;}
	#gnb {display: none;}

	.gnb-open .mob-gnb {display: block; visibility: visible; background: rgba(0,0,0,0.8); backdrop-filter: blur(10px); z-index: 1;}
	.gnb-open #header.scrolled {background: transparent;}
	.gnb-open #header.scrolled .sitelogo a {background-image: url('../img/layout/logo.png');}
	.gnb-open #header.scrolled .sitemap-btn {border: 1px solid rgba(255,255,255,0.3);;}
	.gnb-open #header.scrolled .sitemap-btn span {background:#fff;}

	.sitemap-btn {margin-top: -30px;}

	/* main */
	.main-visual .mail-box {bottom: 40px; left: 15px; width: 200px; height: 65px;}
	.main-visual .mail-box p {font-size: 15px; padding-left: 27px;}
	.main-visual .mail-box p:before {margin-top: -10px; left: 6px;}
	.main-visual .mail-box small {font-size: 15px; padding-left: 27px;}

	/* sub */
	.sub-visual {height:260px;}
	.sub-visual .text-box h2 {font-size: 60px;}

	.real-cont {padding: 70px 0 120px;}
	.real-cont.type02 {padding-bottom: 0;}
	.page-title {margin: 0 auto 40px; padding: 0 15px 30px;}
	.page-title h3 {font-size: 18px; margin-bottom: 12px;}
	.page-title p {font-size: 25px;}

	/* sub01 */
	.about .cont01 ul li {max-width: 250px; margin: 0 30px 25px;}
	.about .cont01 ul li .img-box {margin-bottom: 5px;}
	.about .cont01 ul li .text-box {padding: 0;}
	.about .cont01 ul li .text-box p.num {font-size: 30px; margin-bottom: 10px;} 
	.about .cont01 ul li .text-box p {font-size: 20px;}
	.about .backdrop {height: 100px; margin: 0 auto;}

	/* sub02 */
	.area ul li .text-box p.num {font-size: 18px;}
	.area ul li .text-box p {font-size: 20px;}
	.area .cont01 {margin-bottom: 80px;}
	.area .cont01 ul li {max-width: 400px;}
	.area .cont01 ul li .img-box {height: 250px;}
	.area .cont01 ul li .text-box {padding: 40px 40px 35px;}
	.area .cont02 ul li {max-width: 200px;}
	.area .cont02 ul li .img-box {height: 190px;}
	.area .cont02 ul li .text-box {padding: 30px;}

	/* sub04 */
	.contact .map iframe {height: 320px; margin-bottom: 20px;}
	.contact .details .btn-wrap ul li a {width: 130px; line-height: 43px; font-size: 16px; padding-left: 30px;}
	.contact .details .btn-wrap ul li a:after {right: 24px;}
	.contact .details .info dl {margin-bottom: 6px;}
	.contact .details .info dt {max-width: 55px; font-size: 18px; }
	.contact .details .info dd {width: calc(100% - 55px); font-size: 18px;}

	/* footer */
	#footer {padding:50px 0 40px; }
	.footer-logo img {width: 200px;}
	.footer-info {padding-bottom: 20px; margin-bottom: 20px;}
	.footer-info p {font-size: 16px;}
	.footer-policy {flex-wrap: wrap;}
	.footer-policy p {font-size: 15px;}
	.footer-policy ul {flex-wrap: wrap; margin: 8px -12px;}
	.footer-policy ul li {padding: 0 12px;}
	.footer-policy ul li a {font-size: 16px;}

	.scroll-top {bottom: 50px; right: 15px;}
}

@media (max-width: 768px) {
	/* header */
	#header {height: 80px;}
	#header .sitelogo a {top:10px; background-size: 155px auto;}
	#gnb {top: 38px;}
	.gnb-open #gnb {right: 80px;}
	#gnb>ul>li {padding: 0 20px;}

	.sitemap-btn {width: 50px; height: 50px; margin-top: -21px; right: 15px;}

	/* main */
	.main-visual .video-pc {display: none;}
	.main-visual .video-mo {display: block;}
	.main-visual .mail-box {bottom: 25px; left: 15px; width: 155px; height: 55px;}
	.main-visual .mail-box p {font-size: 13px; padding-left: 0; text-align: center;}
	.main-visual .mail-box p:before {display: none;}
	.main-visual .mail-box small {font-size: 15px; line-height: 1.3em; padding-left: 0; text-align: center;}

	/* sub */
	.sub-visual {height:200px;}
	.sub-visual04 {background-image: url('../img/sub/mo_sub_visual04.jpg');}
	.sub-visual .text-box h2 {font-size: 40px;}

	.real-cont {padding: 50px 0 80px;}
	.page-title {margin: 0 auto 30px; padding: 0 15px 20px;}
	.page-title h3 {font-size: 15px; margin-bottom: 10px;}
	.page-title p {font-size: 18px;}

	/* sub01 */
	.about.real-cont.type02 {padding-bottom: 80px;}
	.about .cont01 ul li {margin: 0 20px 25px;}
	.about .cont01 ul li .img-box {margin-bottom: 5px;}
	.about .cont01 ul li .text-box p.num {font-size: 22px; margin-bottom: 8px;} 
	.about .cont01 ul li .text-box p {font-size: 16px;}
	.about .backdrop {display: none;}
	
	/* sub02 */
	.area ul {margin: -5px;}
	.area ul li {margin: 5px;}
	.area ul li .text-box p.num {font-size: 16px;}
	.area ul li .text-box p {font-size: 18px;}
	.area .cont01 {margin-bottom: 60px;}
	.area .cont01 ul li {max-width: 300px;}
	.area .cont01 ul li .img-box {height: 200px;}
	.area .cont01 ul li .text-box {padding: 30px 30px;}
	.area .cont02 ul li {max-width: 160px;}
	.area .cont02 ul li .img-box {height: 150px;}
	.area .cont02 ul li .text-box {padding: 25px;}

	/* sub04 */
	.contact .map iframe {height: 250px; margin-bottom: 15px;}
	.contact .details .btn-wrap ul li {width: 33.333%;}
	.contact .details .btn-wrap ul li a {width: 100%; line-height: 38px; font-size: 15px; padding-left: 20px;}
	.contact .details .btn-wrap ul li a:after {right: 15px;}
	.contact .details .info dl {margin-bottom: 5px;}
	.contact .details .info dt {max-width: 45px; font-size: 16px;}
	.contact .details .info dd {width: calc(100% - 45px); font-size: 16px; white-space: normal;}

	/* footer */
	#footer {padding:40px 0 30px; text-align: center;}
	.footer-logo {margin-bottom: 20px;}
	.footer-logo img {width: 190px;}
	.footer-info {display: block; padding-bottom: 20px; margin-bottom: 20px;}
	.footer-info p {font-size: 15px;}
	.footer-info .mail-box {width: 190px; height: 50px; margin: 15px auto 0;}
	.footer-info .mail-box p {padding-left: 35px; text-align: left;}
	.footer-info .mail-box p:before {left: 15px;}
	.footer-info .mail-box small {padding-left: 35px; text-align: left;}
	.footer-policy {flex-wrap: wrap; justify-content: center;}
	.footer-policy p {font-size: 14px;}
	.footer-policy ul {flex-wrap: wrap; justify-content: center; margin: 8px -12px;}
	.footer-policy ul li {padding: 2px 12px;}
	.footer-policy ul li a {font-size: 15px;}

	.scroll-top {width: 50px; height: 50px;}
}

@media (max-width: 480px) {
	/* sub */
	.page-title p br {display: none;}

	/* sub01 */
	.about .cont01 ul li {margin: 0 0 40px;}

	/* sub04 */
	.contact .details .btn-wrap ul li a {padding-left: 15px;}
	.contact .details .btn-wrap ul li a:after {right: 10px;}

	/* footer */
	.footer-info p br.mob-only {display: block;}
}