﻿@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Sen:wght@400;700&display=swap');
/* ALL */
body{
	font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
	font-weight: 400;
	background-color: #ffffff;
	color: #262626;
}
#wrap,#contents1,#contents2{
	border-top-width: 15px;
	border-top-style: solid;
}
#contents2,#wrap.top_page main{
	border-bottom-width: 15px;
	border-bottom-style: solid;
}
header,#contents1 .contents_title,#contents2 .contents_title,#top_cms2 .top_cms_wrap,footer{
	border-top-style: solid;
	border-top-width: 5px;	
}
#loader .load_left{right: 50%;}
#loader .load_left figure{right: 0;transform: translate(50%,-50%);}
#loader .load_right{right: 0;}
#loader .load_right figure{left: 0;transform: translate(-50%,-50%);}

#load_after{
	display: none;
	position:fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: 9998;
}
#load_after > div{
	height: 100%;
	position: absolute;
	top:0;
	overflow: hidden;
}
#load_after > div figure{
	width: 60%;
	position: absolute;
	top: 50%;
	opacity: 0;
}
#load_after .load_left{left: 0;width: 0;}
#load_after .load_left figure{right: 0;transform: translate(50%,-50%);}
#load_after .load_right{left: 50%;width: 0;}
#load_after .load_right figure{left: 0;transform: translate(-50%,-50%);}
#load_after.active{display: block;}
#load_after.active > div{
	animation-name: load_after;
	animation-duration: 0.6s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
#load_after.active > div figure{
	animation-name: load_after2;
	animation-delay: 0.5s;
	animation-duration: 0.3s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}

.en_font{
	font-family: 'Sen','Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
}
.font_bold{font-weight: 700;}

.con{
	width: 80%;
	min-width: 1000px;
}
.blur{
  -ms-filter: blur(4px);
  filter: blur(4px);
}
.point_none{pointer-events: none;}

#wrap{transition: ease 0.2s;padding-right: 40px;}
header #header h1{
	max-width: 400px;
}
#main_bt.menu_bt{
	position: fixed;
	width: 66px;
	height: 42px;
	top: 50px;
	right: 60px;
	cursor: pointer;
	z-index: 999;
}
#main_bt.menu_bt.active{}
#main_bt.menu_bt span{
	position: absolute;
	top: 50%;
	right: 0;
	width: 70%;
	height: 2px;
	transform: translateY(-50%);
	transition: ease 0.3s;
}
#main_bt.menu_bt:hover span{width: 100%;}
#main_bt.menu_bt.active span{width: 0;}
#main_bt.menu_bt::before,.menu_bt::after{
	content: "";
	position: absolute;
	right: 0;
	width: 100%;
	height: 2px;
	transition: ease 0.3s;
}
#main_bt.menu_bt::before{
	top: 0;
	border-top-width: 2px;
	border-top-style: solid;
}
#main_bt.menu_bt::after{
	bottom: 0;
	border-bottom-width: 2px;
	border-bottom-style: solid;
}
#main_bt.menu_bt.active::before{transform: rotate(45deg) translateY(-50%);top: 50%;border-color: #ffffff;}
#main_bt.menu_bt.active::after{transform: rotate(-45deg) translateY(50%);bottom: 50%;border-color: #ffffff;}
#main_bt.menu_bt span,#main_bt.menu_bt::before,.menu_bt::after{box-shadow: 0 1px 0 #ffffff;}
#main_bt.menu_bt.active span,#main_bt.menu_bt.active::before,.menu_bt.active::after{box-shadow: none;}

#main_nav{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	z-index: 998;
}
#main_nav #menu_bg{
	position: absolute;
	z-index: -1;
	opacity: 0.8;
	width: 50%;
	height: 100%;
	top: 0;
	left: 50%;
}
#main_nav #menu_bg span{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 100%;
}
#main_nav.active #menu_bg span{
	animation-name: menuin;
	animation-duration: 0.3s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
#main_nav::after{
	content: "";
	position: absolute;
	z-index: -1;
	width: 50%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #ffffff;
}
#main_nav .logo{position: absolute;width: 50%;left: 0;top: 50%; transform: translate(0,-50%);text-align: center;}
#main_nav .logo img{width: 60%;max-width: 400px;opacity: 0;}
#main_nav.active .logo img{
	animation-name: topin;
	animation-duration: 0.3s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
#main_nav nav{
	position: fixed;
	width: 50%;
	height: 100%;
	overflow: auto;
	top: 0;
	right: 0;
	box-sizing: border-box;
	padding-left: 100px;
}
#main_nav nav ul{overflow-x: hidden;padding-top: 100px;opacity: 0;}
#main_nav.active nav ul{
	animation-name: fadein;
	animation-delay: 0.4s;
	animation-duration: 0.3s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
#main_nav nav ul li a{display: inline-block;position: relative;padding-bottom: 8px;line-height: 1;margin-bottom: 20px;}
#main_nav nav ul li a::after{
	content: "";
	position: absolute;
	bottom: 0;
	left: -100%;
	width: 100%;
	height: 5px;
	background-color: #ffffff;
	transition: ease 0.3s;
}
#main_nav nav ul li.on a{padding: 10px 20px 12px 20px;}
#main_nav nav ul li.on a::after{left: 0;}
#main_nav nav ul li a:hover::after{left: 0;}
footer{}
footer #contact_box{
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	margin-bottom: 200px;
}
footer #contact_box .con{
	border-radius: 30px;
	box-shadow: 0 0 50px rgba(0,0,0,0.2);
	transform: translateY(50%);
	box-sizing: border-box;
}
footer #contact_box .con .contact_link a:hover{transform: translateY(-5px);}
footer .sns_links li{width: 50px; margin: 0 20px;transition: ease 0.3s;}
footer .sns_links li:hover{transform: translateY(-3px);opacity: 0.6;}
footer .map iframe{width: 100%;height: 400px;}
#top_return{
	position: fixed;
	top: 0;
	right: 0;
	width: 40px;
	height: 100%;
}
#top_return a{
	position: absolute;
	bottom: 10px;
	display: block;
	padding-top: 100px;
	background-image: url("../Dup/img/top_arrow.svg");
	background-position: top center;
	background-size: 6px 100px;
	background-repeat: no-repeat;
}
#top_return a span{transition: ease 0.3s;}
#top_return a:hover span {transform: translateY(-5px);}

/* TOP PAGE */

#main_img{position: relative;}
#main_img h2{position: absolute;left: 5%;bottom: 15%;z-index: 2;}
#main_img figure:focus{outline: none;border: none;}
#main_img .slick{width: 65%;margin-left: 35%;z-index: 1;text-align: right;}
#main_img .slick-list{margin-bottom: 20px;}
#main_img .arrow{
    cursor: pointer;
    transition: ease 0.3s;
	display: inline-block;
}
#main_img .arrow.next{
	margin-right: 50px;
	margin-left: 10px;
}
#main_img .arrow:hover{
    transform: translateY(-2px);
}
#main_img .slick-arrow span{
    width: 30px;
    height: 30px;
}


#contents1 h4 span:first-letter{font-size: 32px;}
#contents1 .con figure{box-shadow: 0 0 50px rgba(0,0,0,0.2);}
#contents1 .con > div{border-width: 10px;border-style: solid;position: relative;}
#contents1 .con > div p{position: relative;z-index: 2;}
#contents1 .con > div::before,#contents1 .con > div::after{content: ""; display: block; position: absolute; width: 50px;height: 50px;background-color: #ffffff;transition: all 1.5s;z-index: 1;}
#contents1 .con > div::before{top: -10px;left: -10px;}
#contents1 .con > div::after{bottom: -10px;right: -10px;}

#contents2 {overflow-x: hidden}
#contents2 .slick2.slick-initialized .slick-slide{display: flex;}
#contents2 .slick2 .slick-list{overflow:inherit;margin-bottom: 40px;}
#contents2 .slick2 .box{height: 0;}
#contents2 .slick2 .box.slick-active{height: 100%;}
#contents2 .slick2 .box:focus{outline: none;border: none;}
#contents2 .slick2 .box .no{z-index: -2;width: 100%;font-size: 80px;letter-spacing: 10px;}
#contents2 .slick2 .box .no span{padding-left: 50px;padding-right: 45px;text-shadow: 0 0 20px rgba(0,0,0,0.2);}
#contents2 .slick2 .box .no::after{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 35%;
	transform: translateY(-50%);
	border-top-width: 4px;
	border-top-style: solid;
	z-index: -3;
}
#contents2 .slick2 .box figure{width: 120%;margin-left: -20%;z-index: -1;border-radius: 6px;}
#contents2 .slick2 .box > div:first-of-type{padding-top: 200px;}
#contents2 .slick2 .box > div:first-of-type > div{box-shadow: 0 0 50px rgba(0,0,0,0.1);border-radius: 6px;}
#contents2 .slick2 .box > div:first-of-type > div h4{position: relative;}
#contents2 .slick2 .box > div:first-of-type > div h4::after{
	content: "";
	position: absolute;
	top: -2px;
	right: 0;
	width: 80%;
	height: 2px;
	background-color: #fff;
}
#contents2 .slick2 .arrow{
    cursor: pointer;
    transition: ease 0.3s;
	display: inline-block;
	position: relative;
}
#contents2 .slick2 .arrow.next{
	margin-right: 0;
	margin-left: 10px;
}
#contents2 .slick2 .slick-arrow span{
    width: 100px;
    height: 50px;
}
#contents2 .slick2 .arrow::after{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	position: absolute;
	top: 0;
	z-index: 2;
}
#contents2 .slick2 .arrow.prev:hover{
    transform: translateX(-5px);
	opacity: 0.6;
}
#contents2 .slick2 .arrow.next:hover{
    transform: translateX(5px);
	opacity: 0.6;
}
#contents2 .slick2 .arrow.prev .posi_center{transform: translate(30%,-50%);}
#contents2 .slick2 .arrow.next .posi_center{transform: translate(-130%,-50%);}
#contents2 .slick2 .arrow.prev::after{
	border-width: 50px 25px 0 0;
	border-color: #ffffff transparent transparent transparent;
	left: 0;
}
#contents2 .slick2 .arrow.next::after{
	border-width: 0 25px 50px 0;
	border-color: transparent #ffffff transparent transparent;
	right: 0;
}


.contents_title span{padding-right: 80px;}
.contents_title span::after{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 180px 80px;
	border-color: transparent transparent #ffffff transparent;
	position: absolute;
	top: 0;
	right: 0;
}
.contents_more{padding-right: 10px;}
.contents_more a{padding-left: 80px;overflow: hidden;}
.contents_more a::after{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 100px 80px 0 0;
	border-color: #ffffff transparent transparent transparent;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 3;
}
.contents_more a > div{position: relative;z-index: 2;}
.contents_more a span.posi_abs{
	width: 100%;
	height: 100%;
	top: 0;
	left: -100%;
	z-index: 1;
	transition: ease 0.3s;
}
.contents_more a:hover span.posi_abs{left: 0;}

.more a div span{height: 20px;width: 20px;transform: translate(0,5px);}
.more a div span i{transform: translate(-3px,-50%);}
.more a:hover div span{transform: translate(5px,5px);}

.top_cms .top_cms_box .top_cms_title{transform: translateY(-1px);}
.top_cms .top_cms_box .more a{transform: translateY(4px);position: relative;overflow: hidden;}
.top_cms .top_cms_box .more a::after{
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: 0;
	left: 0;
	background-color: #ffffff;
	z-index: 1;
	transition: ease 0.3s;
}
.top_cms .top_cms_box .more a:hover::after{
	left: 100%;
}
#top_cms2 .top_cms .top_cms_box:last-of-type{margin-bottom: 0;}
/* OTHER */
#page_title > div{position: relative;}
#page_title > div::after{
	content: "";
	position: absolute;
	width: 100%;
	height: 90%;
	background-color: #ffffff;
	left: 0;
	bottom: 0;
}
#page_title.active > div:first-of-type::after{
	animation-name: page_title1;
	animation-duration: 0.4s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
#page_title.active > div:last-of-type::after{
	animation-name: page_title1;
	animation-duration: 0.4s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}

.pager li{margin: 0 30px!important;}
.pager li a{display: block;padding: 10px 20px;transition: ease 0.3s;position: relative;}
.pager li.prev a{border-width: 2px;border-style: solid;border-radius: 3px;}
.pager li:not(.prev) a{border-bottom-width: 5px;border-bottom-style: solid;}
.pager li:not(.prev) a::after{content: ""; position: absolute;width: 100%;height: 5px;background-color: #ffffff;top: 100%;left: 0;transition: ease 0.3s;}
.pager li:not(.prev) a:hover::after{left:50%; }

.cate_list li{transform: translateY(1px);}
.cate_list li a {position: relative;display: block; padding: 10px 40px 10px 40px;}
.cate_list li a span{height: 16px;width: 16px;transform: translate(0,-50%);position: absolute;top: 50%;left: 5px;transition: ease 0.3s;}
.cate_list li a span:nth-of-type(1){transform: translate(-20px,-50%);opacity: 0;z-index: 2;}
.cate_list li a span:nth-of-type(2){opacity: 0.3;z-index: 1;}
.cate_list li a:hover span:nth-of-type(1){;transform: translate(0,-50%);opacity: 1;}
.cate_list li a span i{transform: translate(-3px,-50%);transition: ease 0.3s;}


#page07 .map {position: relative;width: 100%;height: 500px;border-radius: 10px;overflow: hidden;box-shadow: 0 0 50px rgba(0,0,0,0.1);}
#page07 .map iframe{position: absolute;width: 100%;height: 100%;}
#page08 .tel_contact .tel_txt{border-left-width: 0;border-radius: 3px;}
#page08 .tel_contact .tel_txt > div{position: relative;}
#page08 .tel_contact .tel_txt > div::after{content: ""; position: absolute;top: 100%;left: 0;width: 33.3333%;height: 3px;background-color: #ffffff;}
#page08 .tel_contact .tel_txt > div:last-of-type::after{display: none;}
#page08 .contact_wrap{box-shadow: 0 0 50px rgba(0,0,0,0.1);border-radius: 10px;}
#page08 .contact_wrap #form_bt .bt{width: 150px;height: 40px;cursor: pointer;position: relative;}
#page08 .contact_wrap #form_bt .bt input{position: absolute;width: 100%;height: 100%;background-color: transparent;top: 0;left: 0;cursor: pointer;}
#page08 .contact_wrap #form_bt .bt::after{content: "SEND";position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.g-recaptcha > div{margin: 30px auto;display:inline-block;}
.disabled{pointer-events: none;opacity:0.3;}


#page10 .box a{padding-right: 130px;}
#page10 .box a::after {content: "";background-color: #ffffff;width: 100%;height: 100%;position: absolute;top: 0;left: 0;transition: ease 0.3s;z-index: 1;}
#page10 .box a:hover::after {left: -20%;opacity: 0;}
#page10 .box a > div{z-index: 2;}
#page10 .box a .box_txt{transition: ease 0.3s;position: relative;}
#page10 .box a:hover .box_txt{color: #ffffff;padding-left: 20px;}
#page10 .box a .more{position: absolute;top: 50%;right: 10px;transform: translateY(-50%);}
#page10 .box a .more div span{height: 20px;width: 20px;transform: translate(0,5px);}
#page10 .box a .more div span i{transform: translate(-3px,-50%);transition: ease 0.3s;}
#page10 .box a:hover .more div span{transform: translate(5px,5px);border-color: #ffffff;}
#page10 .box a:hover .more div span i{color: #ffffff;}

/* ANIMATION */
@keyframes topin {
	0% {opacity:0;transform: translateY(-50px);}
	100% {opacity:1;transform: translateY(0px);}
}
@keyframes fadein {
	0% {opacity:0;}
	100% {opacity:1;}
}
@keyframes menuin {
	0% {left: -20%;top:0;}
	100% {left: 0;top: 0;}
}
@keyframes menuin_sp {
	0% {left: -20px;top:0;}
	100% {left: 0;top: 0;}
}
@keyframes page_title1 {
	0% {height: 90%;}
	100% {height: 0;}
}
@keyframes page_title2 {
	0% {left: -20%;top:0;}
	100% {left: 0;top: 0;}
}
@keyframes load_after {
	0% {width: 0;}
	100% {width: 50%;}
}
@keyframes load_after2 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
	.cate_list li a span i{transform: translate(-3px,-45%);}
}

/* ---------- 1280px ~ 769px ---------- */
@media screen and (min-width:769px) and ( max-width:1280px){
/* ALL */
	.con{
		width: 90%;
		min-width: 90%;
	}
	#contact_box .font_34,.contents_title .font_34,.top_cms .top_cms_title h3.font_34{font-size: 26px;}
	#contact_box p,#contact_box .contact_link{font-size: 14px;}
	#contact_box .contact_link .width_400-max{max-width: 300px;}
	#main_nav nav{
		padding-left: 50px;
	}
	
/* TOP PAGE */
	#main_img {padding-right:0;}
	#main_img h2.font_50{font-size: 36px;}
	
	#contents1 .con > div{padding: 30px;}
	#contents1 h4 span{font-size: 20px;}
	#contents1 h4 span:first-letter{font-size: 24px;}
	#contents1 p{font-size: 14px;}
	#contents2 .slick2 .box .no{font-size: 60px;}
	#contents2 .slick2 .box .no span{padding-left: 40px;padding-right: 35px;}
	#contents2 .slick2 .box .no::after{width: 35%;}
	#contents2 .slick2 .box figure{width: 150%;margin-left: -50%;z-index: -1;border-radius: 6px;}
	#contents2 .slick2 .box > div:first-of-type{width: 60%!important}
	#contents2 .slick2 .box > div:last-of-type{width: 40%!important}
	#contents2 .slick2 .box > div:first-of-type > div{box-shadow: 0 0 50px rgba(0,0,0,0.1);border-radius: 6px;}
	#contents2 .slick2 .box > div:first-of-type > div h4{position: relative;}
	
	
	
	.contents_more{padding-right: 10px;}
	.contents_more .font_18{font-size: 16px;}
	.more a div span{width: 16px;height: 16px;transform: translate(0,5px);}
	.more a div span i{transform: translate(-3px,-50%);font-size: 10px;}
	
	#top_cms1,#top_cms2 .top_cms{border: none;padding: 0;}
	.top_cms .top_cms_box .top_cms_title{transform: translateY(-4px);}
	.top_cms .top_cms_title p{font-size: 14px;}
	
	
/* OTHER */
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
/* ALL */
	#wrap{padding-right: 0;}
	.con{
		width: 90%;
		min-width: 90%;
	}
	#main_bt.menu_bt{
		position: fixed;
		width: 58px;
		height: 40px;
		top: 40px;
		right: 30px;
		cursor: pointer;
		z-index: 999;
	}
	#main_bt.menu_bt:hover span{width: 70%;}
	#main_bt.menu_bt.active span{width: 0;}
	#main_nav::after{display: none}
	#main_nav .logo{display: none;}
	#main_nav nav{
		position: fixed;
		width: 100%;
		height: 100%;
		overflow: auto;
		top: 0;
		right: 0;
		box-sizing: border-box;
	}
	#main_nav #menu_bg{width: 100%;left: 0;}
	header #header h1{
		max-width: 300px;
	}
	footer{border-top-width: 0;}
	footer #contact_box{
		margin-bottom: 230px;
	}
	#loader > div figure{
		width: 70%;
	}
/* TOP PAGE */
	#wrap.top_page header{border-right-width: 0px;}
	#page_links{display: none;}

	#main_img {padding-right:0;}
	#main_img h2{position: static;left: 0;bottom: 0;z-index: 2;}
	#main_img .slick{width: 80%;margin-left: 10%;z-index: 1;text-align: right;}
	#main_img .slick-list{margin-bottom: 20px;}
	#main_img .arrow{
		cursor: pointer;
		transition: ease 0.3s;
		display: inline-block;
	}
	#main_img .arrow.next{
		margin-right: 0px;
		margin-left: 30px;
	}
	#main_img .arrow:hover{
		transform: translateY(-2px);
	}
	#main_img .slick-arrow span{
		width: 30px;
		height: 30px;
	}
	
	#contents1 .con > div{border-width: 7px;}
	#contents1 h4 span:first-letter{font-size: 24px;}
	#contents2 .slick2 .box .no{z-index: -2;width: 100%;font-size: 60px;letter-spacing: 10px;}
	#contents2 .slick2 .box .no span{padding-left: 0px;padding-right: 20px;}
	#contents2 .slick2 .box .no::after{width: 100%;border-top-width: 2px;}
	#contents2 .slick2 .box figure{width: 100%;margin-left: 0;z-index: -1;border-radius: 6px;}
	#contents2 .slick2 .box > div:first-of-type{padding: 0px 50px;transform: translateY(-100px);}
	#contents2 .slick2 .box > div:first-of-type > div h4::after{width: 70%;}
	#contents2 .slick2 .slick-list{margin-bottom: 0;}

	
	.contents_more{padding-right: 10px;}
	.more a div span{width: 16px;height: 16px;transform: translate(0,5px);}
	.more a div span i{transform: translate(-3px,-50%);font-size: 10px;}
	#top_cms1,#top_cms2 .top_cms{border: none;padding: 0;}
	.top_cms .top_cms_box .top_cms_title{transform: translateY(-8px);}
	
/* OTHER */
	.pager li{margin: 0 30px!important;}
	.pager li a{display: block;padding: 5px 10px;}

	#page07 .map {height: 400px;}
	#page08 .tel_contact .tel_txt{border-left-width: 3px;border-left-style: solid;}
	#page08 .tel_contact .tel_txt > div::after{display: none;}

	#page10 .box:last-of-type{margin-bottom: 0;}
	#page10 .box a{padding-right: 125px;border-radius: 6px 6px 0 0;}
	#page10 .box a .box_txt {color: #ffffff;}
	#page10 .box a::after {left: -20%;opacity: 0;}
	#page10 .box a .more div span{transform: translate(5px,5px);border-color: #ffffff;}
	#page10 .box a .more div span i{color: #ffffff;}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
/* ALL */
	.blur{
	  -ms-filter: none;
	  filter: none;
	}
	header #header h1{
		width: 70%;
	}
	#main_bt.menu_bt{
		position: fixed;
		width: 44px;
		height: 32px;
		top: 40px;
		right: 20px;
		cursor: pointer;
		z-index: 999;
	}
	#main_bt.menu_bt:hover span{width: 70%;}
	#main_bt.menu_bt.active span{width: 0;}
	#main_nav.active #menu_bg span{
		animation-name: none;
		display: block;
		top: 0;
		left: 0;
	}
	#main_nav nav ul{padding-top: 30px;}
	#main_nav nav{padding-left: 50px;}
	footer .sns_links{padding: 50px 0;}
	footer .sns_links li{width: 40px; margin: 0 15px;transition: ease 0.3s;}
	footer .sns_links li:hover{transform: translateY(0);opacity: 1;}
	#loader > div figure,#load_after > div figure{
		width: 100%!important;
	}
/* TOP PAGE */
	#main_img .slick{width: 100%;margin-left: 0;z-index: 1;}
	#main_img .arrow.next{
		margin-right: 20px;
		margin-left: 30px;
	}
	.top_cms .top_cms_box .top_cms_title{transform: translateY(-10px);}

	.contents_title span{padding-right: 70px;}
	.contents_title span::after{
		content: "";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 0 100px 50px;
		border-color: transparent transparent #ffffff transparent;
		position: absolute;
		top: 0;
		right: 0;
	}
	#contents1 .con > div{border-width: 6px;}
	#contents1 .con > div::before,#contents1 .con > div::after{content: ""; display: block; position: absolute; width: 30px;height: 30px;background-color: #ffffff;}
	#contents1 .con > div::before{top: -10px;left: -10px;}
	#contents1 .con > div::after{bottom: -10px;right: -10px;}
	#contents1 h4 span:first-letter{font-size: 20px;}
	#contents2 .slick2 .box{display: flex!important;float: none!important;opacity: 1!important;height: 100%!important;left: 0!important;margin-bottom: 50px;}
	#contents2 .slick2 .box .no{z-index: -2;width: 100%;font-size: 50px;letter-spacing: 5px;}
	#contents2 .slick2 .box > div:first-of-type{padding: 0px;padding-top: 30px; transform: translateY(00px);}
	#contents2 .slick2 .box > div:first-of-type > div h4::after{width: 70%;}
	#contents2 .slick2 .slick-list{margin-bottom: 0;}
	#contents2 .slick2 .slick-arrow{display: none!important;}

/* OTHER */
	.pager li{margin: 0!important;}
	.pager li:not(.prev){display: none;}
	
	.cate_list {border-top-width: 3px;border-bottom-width: 3px;}
	.cate_list li a span:nth-of-type(2){display: none;}
	.cate_list li a span:nth-of-type(1){;transform: translate(0,-50%) rotate(90deg);opacity: 1;}
	.cate_list li a span i{transform: translate(-2px,-50%);transition: ease 0.3s;}
	
	#page07 .map {height: 300px;}
	
	.g-recaptcha > div{transform: translateX(-12px);}

	#page10 .box a{padding-right: 90px;}	
	#page10 .box a .more div span{width: 17px;height: 17px;}
}