/*기능 테스트*/
/*이미지 모서리 둥글게*/
/*.rounded-image{border-radius: 5%;}*/
/*이미지 아래 그림자*/
.shadow-image {box-shadow: 0 0px 16px rgba(0, 0, 0, 0.4);} /*수평, 수집, 흐림도, rgba(색상, 투명도) */

.flex_box {display:flex}
.flex_box_2 {display:flex; padding: 10px; border-bottom:  1px solid #ddd;}
.flex_box_3 {display:flex; flex-direction: column; height: 940px; padding-left: 10px; padding-right: 10px; }
.flex_box_4 ul {display:flex; flex-wrap: wrap;	flex-direction:row; justify-content: space-between; height: 740px; padding-left: 50px; padding-right: 50px; margin-top: 10px}

#footer {width:100%; background-color:#ffffff; color:rgba(0,0,0,.8); font-size:0.8rem; line-height:1.5; text-align:center; box-sizing:border-box; padding:20px 3%; border-top: 1px solid #ddd; font-family: 'Ubuntu', sans-serif;}
/*#footer img {margin-bottom:8px}*/

@media screen and (max-width:979px) {
   #footer { font-size: 0.7rem; font-weight: 500; font-family: Ubuntu, sans-serif;}
   .flex_box {flex-wrap:wrap;}
   .flex_box_2 {flex-wrap:wrap; border-bottom: 0 solid #ddd; padding: 0}
   .flex_box_3 {height: 565px; padding: 0; border-bottom:  0 solid #ddd;}
	#main .section_2 {min-height: 475px;}
}

/*메인*/

#main {line-height:1.4; word-break: keep-all;  color:#555}

.main_vi {width:100%; height:100vh; background-color:#333; display:flex; align-items:Center}
.main_vi div {color:#fff; width:100%; text-align:Center;}
.main_vi div h3 {font-size:3em}
.main_vi div p {font-size:0.8em}

#main h3 {color:#111; font-weight:500; display:block; margin-bottom:5px;}

.section_1 {width:100%; height: 681px; text-align:Center; background-color:#f1f1f1; box-sizing:border-box; color:#fff; margin-top: 10px; margin-bottom : 10px;}
.section_1 h3 {font-size:2.5em; color:#fff}

.section_2 {min-height: 400px;}
#main .section_2 {width:100%; -webkit-tap-highlight-color : rgba(0,0,0,0);}
#main .section_2 div.img {width:50%; background-color:#333;}
#main .section_2 div.text {width:50%; background-color:#ffffff; display:flex; align-items:Center; padding:180px 5%;   box-sizing:border-box; text-align:center;}
#main .section_2 div.text div {width:100%}
#main .section_2 div.text h3 {font-size: 1.5em; font-family: Ubuntu, sans-serif; font-weight: 600;}

#main .section_2 div.text a h4 {font-size:1.2em; color: #000;	display:inline-block;	margin:0;	text-transform:uppercase; font-family: Ubuntu, sans-serif; }
#main .section_2 div.text a h4:after {display:block;	content: '';	border-bottom: solid 2px #000000;	transform: scaleX(0);	transition: transform 250ms ease-in-out;}
#main .section_2 div.text a h4:hover:after { transform: scaleX(1); }
#main .section_2 div.text a h4.fromRight:after{ transform-origin:100% 50%; }

#main .section_2 div.flex_box:nth-child(2n) .img {order:2}
#main .section_2 div.flex_box:nth-child(2n) .text {order:1}


#main .section_3 {width:100%; height: 780px;background-color:#fff; box-sizing:border-box; color:#fff;margin: 10px auto;}
#main .section_3 h3 {font-size:2.5em; color:#fff}

#main .section_5 {max-width: 1000px; background-color:#fff; box-sizing:border-box; color:#fff; margin-bottom : 30px; margin-left: auto;	margin-right: auto;}
#main .section_5 h3 {font-size:2.5em; color:#fff}


#main .section_4 {width:100%; -webkit-tap-highlight-color : rgba(0,0,0,0); }
#main .section_4 ul {width:100%; border-left:1px solid #ddd;  box-sizing:border-box;  max-width:1200px; margin:0 auto; display:flex}
#main .section_4 ul li {display:flex; align-items:center; padding:20px 30px; box-sizing:border-box; width:25%; border-right:1px solid #ddd; background-color:#fff}
#main .section_4 ul li a {color:#333}
#main .section_4 ul li h3 {font-size:1.2em; font-weight:700;  margin-bottom:35px; font-family: Ubuntu, sans-serif;}
#main .section_4 ul li p {font-size:0.9em; font-weight:400;  display:block; margin-bottom:20px; font-family: Gowun Batang, sans-serif;}
#main .section_4 ul li a img {transition: all 0.3s ease-out;}
#main .section_4 ul li a:hover img {margin-left:20px}

@media screen and (min-width:979px) {
  #main .pc_br {display:block}
}
@media screen and (max-width:979px) {
	#main p{
		font-family: Gowun Batang, sans-serif;
		font-weight: 400;
		margin-bottom: 10px;
	}
	#main {font-size:16px}
	#main h3 {  margin-bottom:7px;}
	#main .section_1 {  padding:160px 5%;  }
	#main .section_1 h3 {font-size:1.5em;}


	#main .section_2 div.img {width:100%;  height:400px }
	#main .section_2 div.text {width:100%; padding:20px 5% }
	#main .section_2 div.text h3 {font-size: 1em; font-family: Gowun Batang, sans-serif; font-weight: 700;}
	#main .section_2 div.text a h4 {
		font-size: 1em;
	}

	#main .section_2 div.flex_box:nth-child(1n) .img {order:1}
	#main .section_2 div.flex_box:nth-child(1n) .text {order:2}

	#main .section_3 {  }
	#main .section_3 h3 {font-size:1.5em;}

	#main .section_5 {  }
	#main .section_5 h3 {font-size:1.5em;}

	#main .section_4 ul {flex-wrap:wrap}
	#main .section_4 ul li { width:50%; padding:10px 20px}
	#main .section_4 ul li:nth-child(2n) {border-right:none}
	#main .section_4 ul li:nth-child(n + 3) {border-top:1px solid #ddd}
	#main .section_4 ul li h3 {font-size: 1em;	font-family: Gowun Batang, sans-serif;	font-weight: 700; }
	#main .section_4 ul li { align-items:flex-start; }
	#main .section_4 ul li p {
		font-size: 0.8em;
		font-weight: 400;
		display: block;
		margin-bottom: 20px;
		font-family: Gowun Batang, sans-serif;
	}
}


/*서브*/
#sub {font-size:16px}

.sub_vi {width:100%; height:681px; background-color:#333; /* display:flex; */ align-items:Center;}
.sub_vi  h3 {color:#fff; width:100%; text-align:Center; font-size:3em;}
 
.sub_menu {width:100%;  box-sizing:border-box; border-bottom:0 solid #ddd; margin-top: 50px;}
.sub_menu ul {width:100%; max-width:1200px; margin:0 auto; display:inline-block; display:flex;   align-items:center; justify-content:center; font-size:1.2em;   }
.sub_menu ul  li {margin:0 30px; white-space:nowrap;}
.sub_menu ul  li a {display:inline-block;  padding:20px 0; font-family: Gowun Batang, sans-serif; font-weight: 400;}
.sub_menu ul  li.ov {  border-bottom:4px solid #477f59}
.sub_menu ul  li.ov a {padding:20px 0 16px 0; color:#477f59; font-family: Gowun Batang, sans-serif;	font-weight: 700;}


.sub_brand {width:100%; height: 400px;  background-color:#f6f3f0; text-align:center; padding:55px 0; display:inline-block; margin-top: 5px; -webkit-tap-highlight-color : rgba(0,0,0,0); font-family: 'Ubuntu', sans-serif;}
.sub_brand  h2 {font-size:1.7em; margin-bottom:10px; font-weight: 600; font-family: Ubuntu, sans-serif; }
.sub_brand  h3.text::after { content:""; display:block; position: absolute; top:18px; left:50%; border-left:1px solid #666; width:1px; height:60px;}
.sub_brand  h3.text { position:relative; font-size:1.2em; font-weight:bold; padding:100px 0 0;     font-family: 'Noto Sans JP', sans-serif;}
/*.sub_brand  p.text::after { content:""; display:block; position: absolute; top:18px; left:50%; border-left:1px solid #666; width:1px; height:60px;}*/
/*.sub_brand  p.text { position:relative; font-size:1em; font-weight:normal; padding:100px 0 0; margin-bottom: 70px;}*/

.section_2 {width:100%; -webkit-tap-highlight-color : rgba(0,0,0,0);}
.section_2 div.img {width:50%; background-color:#333;}
.section_2 div.text {width:50%; background-color:#ffffff; display:flex; align-items:Center; padding:180px 5%;   box-sizing:border-box; text-align:center;}
.section_2 div.text div {width:100%}
.section_2 div.text h3 {font-size:2em;}

.section_2 div.flex_box_2:nth-child(1n) .text {order:2}
.section_2 div.flex_box_2:nth-child(1n) .img {order:1}
.section_2 div.text h2 {font-size:1.7em; margin-bottom: 50px; font-family: Gowun Batang, sans-serif; font-weight: 700; }
.section_2 div.text h3 { font-size:1em; margin-top: 10px; font-family: Gowun Batang, sans-serif; font-weight: 400;}

.section_3 {width:100%; -webkit-tap-highlight-color : rgba(0,0,0,0);}
.section_3 div.text {width:100%; background-color:#ffffff; display: flex; align-items: center; text-align:center; margin-top: 50px; margin-bottom: 30px;}
.section_3 div.img {width:100%; height: 728px; /*background-color:#333;*/}
.section_3 div.text div {width:100%; height: 100%; align-items: center}
.section_3 div.text h2 {font-size:1.7em; margin-bottom: 20px; font-family: Gowun Batang, sans-serif; font-weight: 700; }
.section_3 div.text h3 { font-size:1.2em; font-weight:400; margin-top: 10px; margin-bottom: 30px; font-family: Gowun Batang, sans-serif;}
/*메인페이지 최 하단 이미지 2개 사이 공백*/
.section_3 .flex_box li#main_bottom_banner1 {padding-right: 5px;}
.section_3 .flex_box li#main_bottom_banner2 {padding-left: 5px;}

.sub_brand .section_4 {width:100%; height: 1200px; border-bottom: 1px solid #666;  -webkit-tap-highlight-color : rgba(0,0,0,0);}
.section_4 div.text {width:100%; background-color:#ffffff; align-items:Center;text-align:left; margin: 50px;}
.section_4 div.text div {width:100%; height: 100%; align-items: center}
.section_4 div.text h2 {font-size:1.7em; font-family: Gowun Batang, sans-serif; font-weight: 700; }
.section_4 div.text h3 { font-size: 1em; margin-top: 10px;	margin-bottom: 30px; font-family: Gowun Batang, sans-serif;	font-weight: 400;}
.section_4 div.img {width:48%; height: 100%; background-color:#333;}

.section_10 div.img {max-width: 1296px; display: inline-block;}
.section_11 div.img {max-width: 1296px; display: inline-block; margin-top: 30px; }
.section_12 div.img {max-width: 1296px; display: inline-block; }

.sub_con {margin:0 auto; padding: 50px;}
.sub_con h2.guide {width:auto; display:inline-block;  padding-bottom:20px; font-size:1.5rem; position:relative; margin-bottom:50px; margin-top:40px; font-family: Ubuntu, sans-serif;}
.sub_con h2.guide:after {position:absolute; width:60%; height:1px; background-color:#333; display:inline-block; content:''; left:20%; bottom:0;}

.container {margin:0 auto; padding: 50px; width: 70%; height: 500px;}
.container-1 {margin-top: 50px; padding: 10px; text-align: center;}

@media screen and (max-width:1800px) {
	.section_4 .flex_box_4 ul { display: flex;flex-wrap: wrap;flex-direction: row;justify-content: space-between;height: 700px;padding-left: 100px;padding-right: 100px;}
	.section_4 .flex_box_4 ul li#youtube_4 {display: none}
}
@media screen and (max-width:400px) {
	.section_2 div.flex_box_2:nth-child(1n) .text {order:1}
	.section_2 div.flex_box_2:nth-child(1n) .img {order:2}
	.section_3 .flex_box li#main_bottom_banner1 {padding-right: 0;}
	.section_3 .flex_box li#main_bottom_banner2 {padding-left: 0;}
	.section_4 .flex_box_4 ul {height: 530px; padding-left: 0; padding-right: 0; justify-content: center;}
	.section_4 .flex_box_4 ul li#youtube_1 iframe { width: 270px; height: 480px; padding: 0;}
	#main .section_4 {margin-top: 20px;}
}
@media screen and (max-width:1340px) {
	.section_4 .flex_box_4 {flex-wrap:wrap; border-bottom: 0 solid #ddd; padding: 0}
	.section_4 .flex_box_4 ul li#youtube_3 {display: none}
}

@media screen and (max-width:965px) {
	.section_4 .flex_box_4 ul li#youtube_2 {display: none}
}

@media screen and (max-width:979px) {
        .sub_con {box-sizing:border-box;}
        .container {padding: 0; width: 90%; height: 10%; margin-top: 30px}
        .container-1 {padding: 10px; text-align: center; margin-top: 30px}
}

@media screen and (max-width:979px) {
        .sub_vi { height:300px; }
        .sub_vi  h3 { font-size:2em}
        .sub_brand {padding: 20px 0; height: 310px;}
        .sub_brand  h2 {margin-bottom: 10px; font-size: 1.1rem;	font-weight: 600; font-family: Ubuntu, sans-serif;}
        .sub_brand  h3.text::after { content:""; display:block; position: absolute; top:18px; left:50%; border-left:1px solid #666; width:1px; height:60px;}
        .sub_brand  h3.text {position: relative; font-size: 0.8em; font-weight: 600; padding: 100px 0 0; font-family: 'Noto Sans JP', sans-serif;}
        .sub_brand  p.text {font-size:0.8em; font-weight:normal;}

		.section_2 div.flex_box_2:nth-child(1n) .img {order:2}
		.section_2 div.flex_box_2:nth-child(1n) .text {order:1}
	    .section_2 div.img {width:100%;  height:400px }
	    .section_2 div.text {width:100%; padding:60px 5%;}
		.section_2 div.text h2 {font-size: 1em;	margin-top: 0; margin-bottom: 8px; font-family: Gowun Batang, sans-serif; font-weight: 700;}
		.section_2 div.text h3 {font-size: 0.8em; margin-top: 0; margin-bottom: 8px; font-family: Gowun Batang, sans-serif;	font-weight: 400;}

		.section_3 div.img {width:100%; }
		.section_3 div.text {width:100%; text-align: center; margin-top: 60px; margin-bottom: 60px; }
		.section_3 div.text h2 {font-size: 1em; margin-top: 0; margin-bottom: 8px; font-family: Gowun Batang, sans-serif; font-weight: 700;}
		.section_3 div.text h3 {font-size: 0.8em; margin-top: 0; margin-bottom: 8px; font-family: Gowun Batang, sans-serif; font-weight: 400;}

	    .section_4 {width:100%; /*height: 800px*/}
		.section_4 div.text {width:100%; text-align: center; margin-top: 40px; margin-bottom: 20px; margin-left: 0;}
		.section_4 div.text h2 {font-size: 1em;	margin-top: 0; margin-bottom: 8px; font-family: Gowun Batang, sans-serif; font-weight: 700;}
		.section_4 div.text h3 {font-size: 0.8em; margin-top: 0; margin-bottom: 8px; font-family: Gowun Batang, sans-serif; font-weight: 400;}

		.sub_brand a img {width: 100%}
		.sub_con { padding:0 0}
		.sub_con h2.guide {font-size:1.3rem; padding-bottom:15px;  margin-bottom:40px; font-family: Gowun Batang, sans-serif; font-weight: 700;}
		.sub_menu ul {padding: 10px 0; box-sizing:border-box;  justify-content:space-between;  overflow-x:auto;  font-size:1.1em; margin-top: -50px; }
		.sub_menu ul li {  margin:0 13px}
		.sub_menu ul  li a {padding: 15px 0; font-size: 0.85em; font-family: Gowun Batang, sans-serif; font-weight: 400;}
		.sub_menu ul  li.ov a {padding:15px 0 11px 0; font-size: 0.9em; font-family: Gowun Batang, sans-serif; font-weight: 700;}
}

.about .flex_box {align-items:flex-start;}
.about .flex_box:last-child {margin-bottom:0; padding-left: 50px;	padding-right: 50px;}
.about .flex_box h3 {color: #383737;  font-size:1.5em; line-height:1.5;  padding-bottom:15px;  font-weight:700; position:relative; margin-bottom:-11px; margin-right: 280px; font-family: Gowun Batang, sans-serif;}
.about .flex_box h3:after {position:absolute; width:50px; height:2px; background-color: #383737; display:inline-block; content:''; left:0; bottom:0;}
@media screen and (max-width:1420px) {
	.about .flex_box h3 {margin-right: 80px}
	/*연혁 크기 변경*/
}

.about .flex_box .text { margin-left:auto; font-size:1.1em; color:#333; line-height:1.3; width:80%}
.about .flex_box .text  .b_t {font-weight:600; font-size:1.2em;}

.about .history {margin-bottom:-5px; position:relative; padding:20px 0;}
.about .history li {display:flex; margin-bottom:7px;}
.about .history li span {width:60px; font-weight:500; color:#333; padding-left:22px}
.about .history li p {width:calc(100% - 100px); font-family: Gowun Batang, sans-serif; font-weight: 400;}
.about .history li p.year {font-size:1.5em; padding-bottom:10px; width:100%; font-family: Gowun Batang, sans-serif; font-weight: 700; }
.about .history li p.year:before {content:''; width:10px; height:10px; background-color:#333; border-radius:50%; display:inline-block; margin-right:10px; vertical-align:2px; position:Relative; z-index:99}
.about .history:after {width:1px; height:100%; position:absolute; left:4px; top:0; content:''; background-color:#ddd}

.about .history_2 {margin-bottom:-5px; padding-top:75px;}
.about .history_2 li {display:flex; margin-bottom:7px;}
.about .history_2 li span {width:100px; font-weight:500; color:#333; padding-left:22px}
.about .history_2 li p {width:calc(100% - 100px); font-family: Gowun Batang, sans-serif; font-weight: 400;}

@media screen and (max-width:979px) {
	.about .flex_box {flex-wrap:wrap; padding-bottom:30px; margin-bottom:30px;}
	.about .flex_box h3 {width:100%; margin-bottom:20px; font-size:1.1em; font-family: Gowun Batang, sans-serif; font-weight: 700; }
	.about .flex_box .text {width:100%; font-size:1em; }
	.about .history {margin-bottom:-5px; position:relative; padding:0 0;}
	.about .history li span {width:40px; font-weight:500; color:#333; padding-left:22px}
	.about .history_2 {margin-bottom:-5px; position:relative; padding:0 0; font-size: 0.9rem}
	.about .history_2 li {display:flex; margin-bottom:7px;}
	.about .history_2 li span {width:40px; font-weight:500; color:#333; padding-left:22px}
	.about .history_2 li p {    width: calc(100% - 100px);
		font-size: 0.9em;
		font-family: Gowun Batang, sans-serif;
		font-weight: 400;}
	.about .history_2 li p.year {font-size:1.5em; font-weight:600; padding-bottom:10px; width:100%; }
	.about .history_2:after {width:1px; height:100%; position:absolute; left:4px; top:0; content:''; background-color:#ddd}
	.about .flex_box:last-child {border-bottom:none; margin-bottom:0;padding: 20px 0 20px 20px;}
	.about .history li p.year {
		font-size: 1.1em;
		padding-bottom: 0px;
		width: 100%;
		font-family: Gowun Batang, sans-serif;
		font-weight: 700;
	}
	.about .history li p {
		width: calc(100% - 100px);
		font-size: 0.8em;
		font-family: Gowun Batang, sans-serif;
		font-weight: 400;
	}

}


.gall ul.gall_list {display:flex; flex-wrap:wrap; align-items:flex-start; width:100%; box-sizing:border-box }
.gall ul.gall_list li .img {width:100%; display:inline-block; padding-bottom:175%; overflow:hidden;    box-sizing:border-box; position:relative; }
.gall ul.gall_list li .img2 {width:100%; display:inline-block; padding-bottom:100%; overflow:hidden;   box-sizing:border-box; position:relative; }


.gall ul.gall_list li img {width:100%; position:absolute; left:50%; top:50%;  transform: translate(-50%, -50%); transition: all 0.3s ease-out;}
.gall ul.gall_list li:hover img {width:110%;}

.gall ul.gall_list li .text {width:100%; box-sizing:border-box; padding:15px 10px; font-size:0.9em}
.gall ul.gall_list li .text h3 {font-size:1.13em; font-weight:600; display:block; margin-bottom:5px}
.gall ul.gall_list li a  h3 {color:#333}
.gall ul.gall_list li .text + p {width:100%; background-color:#f9f9f9; box-sizing:border-box; display:flex; justify-content:space-between; font-size:.93em; padding:10px; }

@media screen and (min-width:979px) {

	.gall ul.gall_list li {width:24%; border:1px solid #ddd; box-sizing:border-box; margin-right:1.33%}
	.gall ul.gall_list li:nth-child(4n) {margin-right:0;  }
    .gall ul.gall_list li:nth-child(n+5) {margin-top:15px}
}

@media screen and (max-width:979px) {
		.gall ul.gall_list {justify-content:space-between; margin-top: -50px;}
		.gall ul.gall_list li {width:48%; border:1px solid #ddd; box-sizing:border-box;  }
		.gall ul.gall_list li:nth-child(n+3) {margin-top:15px}
		.gall ul.gall_list li .text h3 {font-size:1em; font-family: Gowun Batang, sans-serif; font-weight: 700; }
		.gall ul.gall_list li .text + p {font-size:.88em }

}

@media all and (max-width:979px) {
	#main .section_4 ul li#instagram {display: none}
}

