/* Color Preset */
	/*
		main color deeper : #004D40 (900)
		main color : #00897B (600)
		main color lighter : #80CBC4 (200)
		main color lightest : #E0F2F1 (50)
		sub color : #FFB300 (600)
		sub color lighter : #FFE082 (200)
		sub color lightest : #FFECB3 (100)
		sub color lightest : #FFF8E1 (50)
		accent color : #00BFA5 (A700) green
		accent color : #F50057 (A400) pink
		accent color : #D50000 (A700) red
	*/

/* z-index define */
	/*
		loader : 3000
		header .fixer : 1000
	*/

/* common */
	/**/
		@font-face{
			font-family:'Daum';
			font-style:normal;
			font-weight:400;
			src:url('//cdn.jsdelivr.net/korean-webfonts/1/corps/daum/Daum/Daum-Regular.woff') format('woff');
		}
		@font-face{
			font-family:'Daum';
			font-style:normal;
			font-weight:700;
			src:url('//cdn.jsdelivr.net/korean-webfonts/1/corps/daum/Daum/Daum-SemiBold.woff') format('woff');
		}
	/**/
	body {
		background: #fff;
		overflow-x: hidden;
		/*min-width:1200px; /*temp*/
	}
	body.js_is_limit {
		height:100vh;
		overflow-y:hidden;
	}
/* common end */

/* loader */  /* fixed */
	.loader {
		position:fixed;
		top:-20%;
		left:-20%;
		right:-20%;
		bottom:-20%;
		z-index:3000;
		visibility:visible;
		opacity:1;
	}
	.loader.js_is_hidden {
		visibility:hidden;
		opacity:0;
		transition: all ease 0.3s;
		transition-delay:0.6s;
	}
	.loader .left_area {
		position:absolute;
		top:0;
		left:0;
		width:50%;
		height:100%;
		background:#fff;
		opacity:1;
	}
	.loader.js_is_hidden .left_area {
		opacity:0;
		width:0%;
		transition: all ease 0.3s;
		transition-delay:0.3s;
	}
	.loader .right_area {
		position:absolute;
		top:0;
		right:0;
		width:50%;
		height:100%;
		background:#fff;
		opacity:1;
	}
	.loader.js_is_hidden .right_area {
		opacity:0;
		width:0%;
		transition: all ease 0.3s;
		transition-delay:0.3s;
	}
	.loader .sk-cube-grid {
		width:5rem;
		height:5rem;
		position:absolute;
		overflow:hidden;
		border-radius:8px;
		opacity:1;
	}
	.loader.js_is_hidden #loader {
		opacity:0;
		top:30%;
		transition: all ease 0.3s;
	}
	#loader {
		position: absolute;
		top: calc(50% - 20px);
		left: calc(50% - 20px);
	}
	@keyframes loader {
		0% { left: -100px }
		100% { left: 110%; }
	}
	#box {
		width: 50px;
		height: 50px;
		background: #00BFA5;
		animation: animate .5s linear infinite;
		position: absolute;
		top: 0;
		left: 0;
		border-radius: 3px;
	}
	@keyframes animate {
		17% { 
			border-bottom-right-radius: 3px; 
		}
		25% { 
			transform: translateY(9px) rotate(22.5deg); 
		}
		50% {
			transform: translateY(18px) scale(1,.9) rotate(45deg) ;
			border-bottom-right-radius: 40px;
		}
		75% { 
			transform: translateY(9px) rotate(67.5deg);
		}
		100% { 
			transform: translateY(0) rotate(90deg); 
		}
	} 
	#shadow { 
		width: 50px;
		height: 5px;
		background: #000;
		opacity: 0.1;
		position: absolute;
		top: 59px;
		left: 0;
		border-radius: 50%;
		animation: shadow .5s linear infinite;
	}
	@keyframes shadow {
		50% {
			transform: scale(1.2,1);
		}
	}
/* loader end */

/* header common */
	header {
		font-size:0;
		z-index:1000;
	}
	header .fixer {
		left:0;
		top:0;
		width: 100%;
	}
		@media screen and (min-width: 0px) and (max-width: 720px) {
			header {
				position:fixed;
				top:0;
				left:0;
				width:100%;
				padding:12% 0 0;
			}
			header .fixer {
				position:absolute;
				top:0;
				left:0;
				width:100%;
				height:100%;
				background:#fff;
				
			}		
		}
/* header common end */

/* header_top_area */
	.header_top_area {
		background: #00897B;
		height:12px;
	}
	.header_top_area .width_inner{
		max-width:1200px;
		margin:0 auto;
		text-align: right;
		padding:0 1rem;
	}
		@media screen and (min-width: 0px) and (max-width: 720px) {
			.header_top_area {
				display:none;
			}		
		}
	.header_user_menu_box {	
		display: inline-block;
		padding: 1rem 0;
	}
	.header_user_menu {
		display: inline-block;
		vertical-align: middle;
		padding: 0 1rem;
		color: #80CBC4; 
		font-size: 1rem;
		cursor: pointer;
	}
	.header_user_menu:after {
		content: '';
		position: absolute;
		top: 10%; right: 0;
		height: 80%;
		width: 1px;
		background: #80CBC4;
	}
	.header_user_menu:last-child:after {
	   content: '';
	   display:none;
	}
		@media screen and (min-width: 720px) {
			.header_user_menu:hover {
				color: #fff;
			}
		}
/* header_top_area end */

/* header_bottom_area */
	.header_bottom_area {
		background:#fff;
	}
	.header_bottom_area .width_inner{
		max-width:1200px;
		margin:0 auto;
		padding:0 1rem;
	}
		@media screen and (min-width: 0px) and (max-width: 720px) {
			.header_bottom_area .width_inner{
				padding:0 0;
				border-bottom:1px solid #ccc;
			}
		}
	.header_contact_icn_box {
		display:none;
		vertical-align:middle;
		width:12%;
		cursor:pointer;
	}
		@media screen and (min-width: 0px) and (max-width: 720px) {
			.header_contact_icn_box {
				display:inline-block;
			}
		}		
		.header_contact_icn_box .ratio_inner{
			padding:100% 0 0;
		}
		.header_contact_icn_box .material-icons{
			position:absolute;
			font-size:8vw;
			color:#00897B;
		}
		.header_contact_icn_box .material-icons.on{
			display:block;
		}
		.header_contact_icn_box .material-icons.off{
			display:none;
		}
	.header_menu_icn_box {
		display:none;
		vertical-align:middle;
		width:12%;
		cursor:pointer;
		max-width:70px;
	}
		@media screen and (min-width: 721px) and (max-width: 1000px) {
			.header_menu_icn_box {
				display:inline-block;
				position:absolute;
				top:0;
				right:0;
			}
		}
		@media screen and (min-width: 0px) and (max-width: 720px) {
			.header_menu_icn_box {
				display:inline-block;
			}
		}
		.header_menu_icn_box .ratio_inner{
			padding:100% 0 0;
		}
		.header_menu_icn_box .icn {
			position: absolute;
			width: 60%;
			height: 60%;
		}
		.header_menu_icn_box .bar {
			position: absolute;
			width: 100%;
			height: 14%;
			left: 0;
			background: #FFE082;
			border-radius: 12px;
			opacity:1;
			transition: all linear 0.2s;
			-ms-transition: all linear 0.2s;
			-moz-transition: all linear 0.2s;
			-webkit-transition: all linear 0.2s;
		}
		.header_menu_icn_box .bar1{
			top: 10%;
		}
		.header_menu_icn_box .bar2{
			top: 42%;
			background: #00897B;
		}
		.header_menu_icn_box .bar3{
			top: 74%;
		}
		.header_menu_icn_box.on .bar1{
			top:42%;
			transform: rotate(-45deg);
			background:#FFB300;
		}
		.header_menu_icn_box.on .bar2{
			transform:translate(300%,0);
			opacity:0;
		}
		.header_menu_icn_box.on .bar3 {
			top:42%;
			transform: rotate(45deg);
			background:#FFB300;
		}
	.header_logo_box {
		display: inline-block;
		vertical-align: middle;
		min-width: 160px;
		background:#fff;
	}
	.header_logo_box .x2{	
		display:inline-block;
	}
	.header_logo_box .x1{	
		display:none;
	}
		@media screen and (min-width: 0px) and (max-width: 720px) {
			.header_logo_box {
				width:76%;
				text-align:center;
			}
			.header_logo_box .x2{	
				display:none;
			}
			.header_logo_box .x1{	
				display:inline-block;
			}
		}
/* header_bottom_area */

/* header_menu */
	.header_menu_box {
		display: inline-block;
		vertical-align: middle;
		width: calc(100% - 160px);
		text-align:right;
	}
		@media screen and (min-width: 0px) and (max-width: 1000px) {
			.header_menu_box {
				background:#00897B;
				width:100%;
				max-width:720px;
				position:absolute;
				top:100%;
				right:0;
				opacity:0;
				/*transition: all ease 0.2s;
				-ms-transition: all ease 0.2s;
				-webkit-transition: all ease 0.2s;*/
				transform:translate3d(100%,0,0);
				-ms-transform:translate3d(100%,0,0);
				-webkit-transform:translate3d(100%,0,0);
			}
			.header_menu_box.on {
				opacity:1;
				transition: all ease 0.2s;
				-ms-transition: all ease 0.2s;
				-webkit-transition: all ease 0.2s;
				transform:translate3d(0,0,0);
				-ms-transform:translate3d(0,0,0);
				-webkit-transform:translate3d(0,0,0);
			}
		}
	.menu_group {
		display:inline-block;
		vertical-align:middle;
		white-space:nowrap;
		text-align:center;
	}
	.menu_group.mobile {
		display:none;
	}
		@media screen and (min-width: 0px) and (max-width: 1000px) {
			.menu_group {
				display:block;
				text-align:left;
				background:#00897B;
				border-bottom:1px solid #80CBC4;
			}
			.menu_group.mobile {
				display:block;
			}
		}
	.main_menu {
		font-size:1.2rem;
		line-height:6rem;
		padding:0 1rem;
		cursor:pointer;
	}
		@media screen and (min-width: 0px) and (max-width: 1000px) {
			.main_menu {
				line-height:4rem;
				color:#fff;
			}
		}
	.mobile_user_menu {
	}
		@media screen and (min-width: 0px) and (max-width: 1000px) {
			.mobile_user_menu {
				display:inline-block;
				vertical-align:middle;
				width:50%;
				line-height:4rem;
				color:#fff;
				font-size:1.2rem;
				cursor:pointer;
				text-align:center;
			}
			.mobile_user_menu:first-child:after {
				content:"";
				position:absolute;
				top:1.4rem;
				width:1px;
				height:1.2rem;
				right:0;
				background:#fff;
			}
			.mobile_user_menu .material-icons{
				font-size:2rem;
				margin:0 0.4rem 0 0;
				color:#80CBC4;
			}
		}
	.main_menu .icn {
		display: none;
	}
		@media screen and (min-width: 0px) and (max-width: 1000px) {
			.main_menu .icn {
				display:block;
				position:absolute;
				width:1.6rem;
				height:1.6rem;
				right:1rem;
			}
			.main_menu .icn .row {
				width:100%;
				height:4px;
				position:absolute;
				top:50%;
				margin-top:-2px;
				left:0;
				background:#80CBC4;
				border-radius:6px;
				transition: all ease 0.2s;
			}
			.main_menu .icn .clm {
				width:4px;
				height:100%;
				position:absolute;
				top:0px;
				left:50%;
				margin-left:-2px;
				background:#80CBC4;
				border-radius:6px;
				transition: all ease 0.2s;
			}
			.main_menu.on .icn .row {
				background:#FDD835;
				transform:rotate(-45deg);
				-ms-transform:rotate(-45deg);
				-moz-transform:rotate(-45deg);
				-webkit-transform:rotate(-45deg);
			}
			.main_menu.on .icn .clm {
				background:#FDD835;
				transform:rotate(135deg);
				-ms-transform:rotate(135deg);
				-moz-transform:rotate(135deg);
				-webkit-transform:rotate(135deg);
			}
		}
	.sub_menu_box {
	}
		@media screen and (min-width: 1001px) {
			.sub_menu_box {
				display:inline-block;
				vertical-align:top;
				background:#fff;
				border:1px solid #ccc;
				border-radius:4px;
				padding:0.8rem 0.8rem;
				position:absolute;
				top:80%;
				left:50%;
				transform:translate3d(-50.1%,4rem,0);
				opacity:0;
				transition:all ease 0.3s;
				visibility:hidden;
			}		
		}
		
		@media screen and (min-width: 0px) and (max-width: 1000px) {
			.sub_menu_box {
				display:none;
				text-align:left;
				background:#fff;
			}
			.sub_menu_box.on {
				display:block;
			}
		}
		@media screen and (min-width: 1001px) {
			.menu_group:hover .sub_menu_box{
				transform:translate3d(-50.1%,0,0);
				opacity:1;
				transition:all ease 0.3s;
				visibility:visible;
			}
		}
	.sub_menu {
		font-size:1rem;
		border-bottom:1px solid transparent;
		padding:0 1.6rem;
		line-height:2rem;
		margin:0.4rem 0;
		color:#999;
	}
		@media screen and (min-width: 0px) and (max-width: 1000px) {
			.sub_menu {
				line-height:3.2rem;
				margin:0 0;
				color:#00897B;
				border-bottom:1px solid #80CBC4;
			}
			.sub_menu:last-child {
				border-bottom:none;
			}
		}
		@media screen and (min-width: 1001px) {
			.sub_menu:hover {
				color: #00897B;
				border-bottom:1px solid #00897B;
			}
		}
/* header_menu end */

/* header_sub_menu_bot */
	.header .header_sub_menu_bot {
		position: absolute;
		display: none;
		left: 0; right: 0;
		background: rgba(255, 255, 255, 0.8);
		max-width: 2000px;
		opacity: 0;
		visibility: hidden;
		z-index: 100;
		transition: all 0.3s ease;
		transform: translate3d(0, -100%, 0);
		-ms-transform: translate3d(0, -100%, 0);
		-moz-transform: translate3d(0, -100%, 0);
		-webkit-transform: translate3d(0, -100%, 0);
	}
	.header .header_sub_menu_bot.on {
		opacity: 1;
		visibility: visible;
		transform: translate3d(0, 0, 0);
		-ms-transform: translate3d(0, 0, 0);
		-moz-transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}
	.header.pc .header_sub_menu_bot {
		display: block;
	}
	.header.mobile .header_sub_menu_bot {
		display: none;
	}
	.header.pc .header_sub_menu_bot .header_sub_logo {
		display: inline-block;
		vertical-align: middle;
		width:200px;
		/*background: url(../img/common/sub_logo.png) no-repeat right center;*/
	}
	.header.pc .header_sub_menu_bot .header_sub_logo .txt {
		font-size: 17px;
		color: #00897B;
		padding: 45px 40px 45px 0;
		white-space: nowrap;
	}
	.header.pc .header_sub_menu_bot .header_sub_logo .txt em {
		display: block;
	}
	.header.pc .header_sub_menu_bot .header_sub_menu_wrap {
		display: inline-block;
		vertical-align: middle;
		width: calc(100% - 160px);
	}
	.header.pc .header_sub_menu_bot .header_sub_menu_box {
		
		display: inline-block;
		vertical-align: top;
		text-align: center;
	}
	.header.pc .header_sub_menu_bot .header_sub_menu {
		font-size: 14px;
		padding: 10px 0;
	}
	.header.pc .header_sub_menu_bot .header_sub_menu:hover {
		font-weight: bold;
	}
/* header_sub_menu_bot end */

/* header fix */
	.header.pc.fix .fixer {
		position: fixed;
		top: 0; left: 0; right: 0;
		z-index: 2000;
		max-width: 2000px;
	}
/* header fix end */

/* common_banner_module */  /* fixed */
	.common_banner_module {
		padding:4rem 0;
		border-top:1px solid #dfdfdf;
		font-size:0;
		z-index:800;
		background:#fff;
	}
		@media screen and (min-width: 0px) and (max-width: 880px) {
			.common_banner_module {
				padding:0 0;
			}
		}
	.common_banner_module .width_inner{
		max-width:1200px;
		margin:0 auto;
	}
	.common_banner {
		border-right:1px solid #80CBC4;
		padding:0.8rem 1.6rem;
		min-height:16rem;
		width:25%;
		display:inline-block;
		vertical-align:top;
	}
	.common_banner:last-child {
		border-right:none;
	}
		@media screen and (min-width: 0px) and (max-width: 880px) {
			.common_banner {
				width:98%;
				margin:1% 1%;
				padding:0.8rem 0.8rem;
				min-height:0;
				border-right:none;
				border-bottom:1px solid #80CBC4;
			}
			.common_banner:last-child {
				border-right:none;
				border-bottom:none;
			}
		}
	.common_banner_icn {
		position:absolute;
		bottom:0;
		right:1.2rem;
		font-size:4rem;
		color:#FFD54F;
		z-index:-1;
	}
		@media screen and (min-width: 0px) and (max-width: 880px) {
			.common_banner_icn {
				color:#FFECB3;
			}
		}
	.common_banner_tit {
		font-size:1rem;
		color:#aaa;
	}
	.common_banner_sub_tit {
		font-size:1.2rem;
		font-weight:600;
		color:#444;
		padding:0.6rem 0 1.2rem;
	}
	.common_banner_ctn {
		font-size:1rem;
		line-height:1.4em;
		color:#888;
	}
		.common_banner_ctn .phone {
			display:inline-block;
			padding:0 0 1.2rem;
			font-size:1.8rem;
			font-weight:600;
			color:#00897B;
		}
			@media screen and (min-width: 0px) and (max-width: 880px) {
				.common_banner_ctn .phone {
					color:#FFB300;
				}
			}
		.common_banner_ctn .biztime b{
			display:inline-block;
			vertical-align:middle;
			color:crimson;
			line-height:1.8em;
			font-weight:400;
		}
		.common_banner_ctn .biztime span {
			display:inline-block;
			vertical-align:middle;
		}
		.common_banner_ctn .biztime em{
			display:block;
		}
			@media screen and (min-width: 0px) and (max-width: 880px) {
				.common_banner_ctn .biztime em{
					display:inline-block;
					vertical-align:middle;
					height:1.8rem;
					margin:0 0.6rem;
				}
			}
	.common_banner_link {
		position:absolute;
		bottom:1.2rem;
		left:2rem;
		font-size:0;
		color:#80CBC4;
		transition: all ease 0.2s;
		/*padding:0.4rem 0.4rem;*/
		/*border-bottom:2px solid transparent;*/
	}
	.common_banner_link .icn_txt {
		font-weight:600;
		font-size:1rem;
	}
	.common_banner_link .material-icons{
		font-size:1.4rem;
	}
	.common_banner_link .material-icons.act2{
		margin-left:-1rem;
	}
		@media screen and (min-width: 0px) and (max-width: 880px) {
			.common_banner_link {
				display:none;
			}
		}
		@media screen and (min-width: 720px) {	
			.common_banner_link .material-icons{
				font-size:1.4rem;
				opacity:0;
				transition: all ease 0.2s;
				transition-delay:0.1s;
				margin-left:1rem;
			}
			.common_banner_link .material-icons.act2{
				margin-left:1rem;
				transition-delay:0s;
			}
			.common_banner_link:hover {
				color:#00897B;
			}
			.common_banner_link:hover .material-icons{
				opacity:1;
				margin-left:0;
				transition-delay:0s;
			}
			.common_banner_link:hover .material-icons.act2{
				opacity:1;
				margin-left:-1rem;
				transition-delay:0.1s;
			}
		}
	.common_banner_link.is-content {
		position:relative;
		display:inline-block;
		bottom:auto;
		left:auto;
		font-size:0;
		color:#80CBC4;
		transition: all ease 0.2s;
		cursor:pointer;
	}
	.common_banner_mobile_link {
		display:none;
	}
		@media screen and (min-width: 0px) and (max-width: 880px) {
			.common_banner_mobile_link {
				display:block;
				position:absolute;
				top:0;
				left:0;
				right:0;
				bottom:0;
			}
		}
/* common_banner_module end */

/* footer */  /* fixed */
	footer {
		background:#00695C;
		font-size:0;
		z-index:1000;
	}
	.footer_top_area {
		background:#00897B;
	}
	.footer_top_area .width_inner{
		max-width:1200px;
		margin:0 auto;
		height:3rem; /*temp*/
	}
	.footer_bottom_area {
	}
	.footer_bottom_area .width_inner{
		max-width:1200px;
		margin:0 auto;
		padding:2rem 100px;
	}
		@media screen and (min-width: 0px) and (max-width: 980px) {
			.footer_bottom_area .width_inner{
				padding:2rem 2rem;
			}
		}
		.footer_logo_box {
			display:inline-block;
			vertical-align:middle;
			width:160px;
		}
			@media screen and (min-width: 0px) and (max-width: 640px) {
				.footer_logo_box {
					width:100%;
					text-align:center;
					padding:0 0 1rem;
				}
			}
		.footer_logo_box .x1{
			display:none;
		}
		.footer_logo_box .x2{
			display:inline-block;
		}
		.footer_info_box {
			display:inline-block;
			vertical-align:middle;
			text-align:left;
			width:calc(100% - 160px);
		}
			@media screen and (min-width: 0px) and (max-width: 640px) {
				.footer_info_box {
					width:100%;
					text-align:center;
				}
			}
		.footer_info {
			display:inline-block;
			vertical-align:middle;
			color:#E0F2F1;
			font-size:1rem;
			padding:0 0.8rem;
			margin:0.4rem 0;
			/*border-right:1px solid #E0F2F1;*/
		}
		.footer_info:last-child {
			border-right:none;
		}
		.footer_copy_box {
			font-size:1rem;
			text-align:center;
			padding:0.8rem 0;
			line-height:1.4rem;
			color:#ddd;
		}
/* footer end */
