/*=================================================
		00. 공통
=================================================*/

@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  src: url('../fonts/Pretendard-Black.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  src: url('../fonts/Pretendard-ExtraBold.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  src: url('../fonts/Pretendard-Bold.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  src: url('../fonts/Pretendard-SemiBold.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  src: url('../fonts/Pretendard-Medium.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  src: url('../fonts/Pretendard-Regular.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  src: url('../fonts/Pretendard-Light.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  src: url('../fonts/Pretendard-ExtraLight.ttf') format('truetype');
}
@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  src: url('../fonts/Pretendard-Thin.ttf') format('truetype');
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: 0;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    content:'';
	background:url('../img/dots.png');
    position: absolute;
    top: 0;
    left: 0;
    width: 14px;
    height: 14px;
    text-align: center;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
	background:url('../img/dots_on.png');
}

/*****#####===== movie 공통 =====#####*****/

*{
	 font-family: 'Pretendard', sans-serif;
}

body{background-color:#f2eee6; font-family: 'Pretendard', sans-serif;;}
body section{padding:180px 0;}
.mov_bg {width: 100%; height: 100%; background: rgba(0,0,0,0.6);position: fixed; display: none;z-index: 9990;}

/*****#####===== 슬라이드 버튼 =====#####*****/
.slide-color-btn{
	display: inline-block;
	position: relative;
	margin: 15px 0;
	padding: /* 18px */0 30px;

	background: none;
	border: 1px solid #A2A3A4;

	/*font-family: 'Montserrat',sans-serif;*/
	letter-spacing: 2px;
	text-transform: uppercase;

	-webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -ms-transition:all 0.3s;
    -o-transition:all 0.3s;
    transition:all 0.3s;
}

.slide-color-btn:before{
	content:"";
	display:block;
	position:absolute;
	z-index:-1;
	top:100%;
	left:-1px;
	bottom:0px;
	right:-1px;
	/*border: 1px solid #fff;*/
	/*border-bottom: none;*/
	background:#fff;

	-webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -ms-transition:all 0.3s;
    -o-transition:all 0.3s;
    transition:all 0.3s;
}

.slide-color-btn1:before{
	content:"";
	display:block;
	position:absolute;
	z-index:-1;
	top:100%;
	left:-1px;
	bottom:0px;
	right:-1px;
	color: #fff;
	/*border: 1px solid #;*/
	/*border-bottom: none;*/
	background:#198846;

	-webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -ms-transition:all 0.3s;
    -o-transition:all 0.3s;
    transition:all 0.3s;
}

.slide-color-btn:hover{
	background-color: #fff;
}
.slide-color-btn1:hover{
	color: #fff;
}

.slide-color-btn:hover:before{
	top: -1px;
}

/*****#####===== 구분선 =====#####*****/
.separator{
	display: inline-block;
	width: 70px;
	height: 1px;
	background: #333;
	margin-top: 10px;
	margin-bottom: 10px;
}

/*****#####===== 게시판 카테고리 =====#####*****/
.bcat-btn-wrap{
	margin-bottom: 60px;
}

.bcat-btn-wrap li{
	margin-bottom: 10px;
	/*padding: 0 20px;*/

	font-size: 16px;
}

.bcat-btn-wrap li .bcat-btn{
	position: relative;
	display: block;

	/*font-family: 'Montserrat', 'Nanum Gothic';*/
	color: #AAAAAA;

	transition: all 0.5s ease-in-out;
}

.bcat-btn-wrap .bcat-btn.active,
.bcat-btn-wrap .bcat-btn:hover{
	font-weight: bold;
	7color: #222222;
}

.bcat-btn-wrap .bcat-btn .underline{
	position: absolute;
	display: block;
	left: 0;
	overflow: hidden;
	width: 0;
	height: 2px;

	background-color: #0281e3;

	transition: all 0.5s ease-in-out;
}

.bcat-btn-wrap .bcat-btn.active .underline,
.bcat-btn-wrap .bcat-btn:hover .underline{
	width: 100%;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** xs *****/
@media (max-width: 767px){
	.bcat-btn-wrap{
		margin-bottom: 30px;
	}

	.bcat-btn-wrap li{
		/*padding: 0 10px;*/
	}

	#colum-slider1 {
		padding-left:0;
	}
}
/*=================================================
		01. Header
=================================================*/
header{
	position: relative;
	overflow: hidden;
	width: 100%;
	margin: 0;
	padding: 0;

	color: #FFFFFF;
}

header h2{
	margin: 20px 0;

	/*font-family: 'Montserrat',sans-serif;*/
	font-weight: 700;
	font-size: 100px;
	letter-spacing: -0.05em;
}

header h5{
	margin: 20px 0;

	/*font-family: 'Montserrat',sans-serif;*/
	font-weight: 400;
	text-transform: uppercase;
	line-height: 1.2;
	letter-spacing: 0.2em;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** xs *****/
@media (max-width: 767px){
	header h2{
		margin: 0 0 15px;

		font-size: 35px;
	}

	header h5{
		display: none;
	}
}


/* nav */
#nav{ position:absolute; top:0; z-index:999; width:100%;}
/* #nav .container{width:100%; max-width:1170px; margin:0 auto;} */
.nav_container{max-width:100%; width:100%; padding:0 50px; margin:0 auto; position:relative;}
.nav_bg{width:100%;}

.nav_container{height:80px; line-height:80px;}
.nav_container .nav_flex_wrap{display: flex; align-items: flex-end; width: auto;}
.nav_container .nav_flex_wrap .nav_flex{display: flex; align-items: center; justify-content: space-between; width: 100% !important; gap:72px; margin-bottom:0;}
.nav_container ul li a{font-size:1.3em;}
.nav_container .mediPlayer{display:inline-block; margin:15px 0 0 20px;}
.nav_container ul li a:focus{font-weight:bold;}

.simple-menu{position:fixed;  width: 100%; top: 0; left: 0;}
.simple-menu.fixed {background: #f2eee6; }
.simple-menu.fixed:after{display:block;  content:''; position:absolute; background:url('../img/nav_bg.png')no-repeat top center / 100%; width:100%; height:7px;}

.container{width:100%; max-width:1480px; padding-left:40px; padding-right:40px; margin:0 auto;}

/* nav audio */
.mediPlayer .control {opacity: 0; pointer-events : none;  cursor: pointer;}
.mediPlayer .not-started .play, .mediPlayer .paused .play {opacity : 1;}
.mediPlayer .playing .pause {opacity : 1;}
.mediPlayer .playing .play {opacity : 0;}
.mediPlayer .ended .stop {opacity:1; pointer-events : none;}
.mediPlayer .precache-bar .done {opacity : 0;}
.mediPlayer .not-started .progress-bar, .mediPlayer .ended .progress-bar {display : none;}
.mediPlayer .ended .progress-track {stroke-opacity : 1;}
.mediPlayer .progress-bar,.mediPlayer .precache-bar { transition: stroke-dashoffset 500ms;
    stroke-dasharray  : 298.1371428256714;
    stroke-dashoffset : 298.1371428256714;
}
.mediPlayer {}
.mediPlayer audio{display:block !important;}
.mediPlayer svg{width:30px !important; height:30px !important;}
.mediPlayer svg g{width:100%;}
.mediPlayer svg img{width:100%; display:block;}

#main_bn{padding:0; padding-bottom:100px;}
#main_bn .mnone{display:block;}
#main_bn .pcnone{display:none;}


#introduce{background:none; position:relative; display:flex; align-items: center; justify-content: center; padding:120px 0 100px 0;}
#introduce .container{display:flex; gap:60px;}
#introduce .container:after, #introduce .container:before{display:none;}
.cp_bg img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:-1; background:none;}
.cp_txt{text-align:left; word-break:keep-all; color:#fff; display: flex; flex-direction: column; align-items: flex-end; padding-top:40px;}
.cp_txt strong{display:block; width:100%; font-size:1.3em; font-weight:600; text-align:left; padding-bottom:30px;}
.cp_txt p{font-size: 1.1em; line-height: 1.7em; font-weight: 400; color: #fff; padding-bottom:50px; padding-right:20%;}
.cp_txt p span.cp_txt_plus{display:block; padding-top:18px;}
.cp_txt p span.ceo_name{width:100%; text-align:left; display:block; margin-top:30px;}
.cp_txt p span.ceo_name img{padding-left:10px;}

#cservice { padding: 180px 0 100px 0;}
#cservice .section-title{color:#333;}
.cs_bg{max-width:1180px; width:100%; margin:0 auto; background:none;}
.cs_txt{width:50%; text-align:left; padding:0 25px;}
.cs_txt h3{color:#522912; font-family: 'Nanum Myeongjo', serif; font-size:2.2em; font-weight:900;}
.cs_txt h3 img{vertical-align:bottom;}
.cs_txt h3 span{font-size:0.7em; padding-left:8px; font-weight:400;}
.cs_txt ul{margin-top:60px;}
.cs_txt ul li{display:flex; padding-bottom:8px; font-weight:600; font-size:1.2em;}
.cs_txt ul li:last-child{padding-bottom:0;}
.cs_txt ul li span{width:24%; color:#555; font-weight:500;}
.cs_txt ul li p{color:#222; font-weight:600; word-break:keep-all;}
.mapwrap{width:50%;}
.mapwrap .mapdiv{width:100%;}
.mapwrap .mapdiv .wrap_map{height:480px;}

#mprocess{background:none; position:relative;}
#mprocess .container{display:flex; align-items: center;}
#mprocess .container > img{transition:ease 0.8s;}
.process_bg{}
.process_bg1{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:-2;}
.process_bg2{position:absolute; left:0; top:-10%; z-index:-1;}
#mprocess p{color:#230f06; font-size:1.3em; padding-bottom:40px;}
#mprocess .mp_img{padding:0;}
#mprocess .mp_img img{max-width:1300px; width:100%; margin:0 auto;}
#mprocess a{display:block; margin:0 auto; padding:14px 0; width:200px; border:2px solid #7f6644; color:#333; font-size:1.2em;}
#mprocess .mp_img .mnone{display:block;}
#mprocess .mp_img .pcnone{display:none;}
.mp_txt h2, .mp_txt p{text-align:left; padding-left:120px;}

/* popup */
.pop_video { margin: 0 auto; position: relative; }
.pop_video h2{color:#fff;}
.pop_video button {background:url('../img/btn_mp_view.png')no-repeat center center / 100%; display:block; border:0; margin-left:8.5%;
padding:8px 0; width:186px; height:57px; color:#fff; font-size:1.2em; outline:none;}
.pop_video .modal-back { height: 0; width: 0; opacity: 0; overflow: hidden; transition: opacity 0.2s ease-in;}
.pop_video #modal-toggle { position: absolute; left: 0; top: 0; height: 100%; width: 100%; margin: 0; opacity: 0; cursor: pointer;}
.pop_video #modal-toggle:hover ~ button {}
.pop_video #modal-toggle:checked {width: 100vw; height: 100vh;  position: fixed;  left: 0;  top: 0; opacity: 0;}
.pop_video #modal-toggle:checked ~ .modal-back { background-color: rgba(0, 0, 0, 0.6);  width: 100vw; height: 100vh; position: fixed;  left: 0;  top: 0;
  z-index: 9999;  pointer-events: none;  opacity: 1;}
.pop_video #modal-toggle:checked ~ .modal-back .modal-con{max-width: 800px; width: 100%; height: auto; padding: 0 20px; position: absolute;
  left:50%; top:50%; transform:translate(-50%,-50%); border-radius: 4px;  z-index: 999;  pointer-events: auto;  cursor: auto; display:block !important;}

.modal-close { width:30px; height:30px; position:relative; float:right; display:block;}
.modal-close::before {height: 30px; width: 2px; background-color: #fff; transform: rotate(45deg); content:'';  display:block; position:absolute; right:0;}
.modal-close::after{ height:30px; width: 2px; background-color: #fff; transform: rotate(-45deg); content:''; display:block; position:absolute; right:0;}
.modal-close:hover{cursor:pointer;}

.pop_video video{width:100% !important; height:100% !important; box-shadow: 0 3px 7px rgba(0, 0, 0, 0.6); outline:none;}


#patent{background:none;}
#patent ul{width:100%; margin:30px auto; padding:0;}
#patent ul li{display:inline-block; width:23%; padding:0 1%;}
#patent ul li img{max-width:200px; width:100%; box-shadow: 6px 18px 31px -2px rgba(200,165,116,0.75);
-webkit-box-shadow: 6px 18px 31px -2px rgba(200,165,116,0.75);
-moz-box-shadow: 6px 18px 31px -2px rgba(200,165,116,0.75);}


#way{position:relative; color:#fff; padding: 50px 0 150px 0;}
.way_bg{position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index:-1;}
.way_wrap{}
.way_txt_wrap{display:flex; justify-content: space-between; align-items:center;}
.way_txt_wrap .way_img{width:50%; display:flex; align-items:flex-start;}
.way_txt_wrap:nth-of-type(1) {padding-bottom:60px;}
.way_txt_wrap:nth-of-type(1) .way_img img{align-items:center; display:block; width:62%; margin:0 auto;}
.way_txt_wrap:nth-of-type(2) .way_img img{width:80%;}
.way_txt{text-align:left; width:50%;}
.way_txt h3{padding-bottom:15px;}
.way_txt ul {margin-left:20px;}
.way_txt ul li{font-size:1.2em; list-style:disc; padding-bottom:7px; word-break:keep-all;}
.way_txt p{font-size:1.2em; line-height:1.6;}


#movie{width:100%; padding:100px 0 50px 0;}
#movie .movie_wrap{max-width:1350px; width:100%; margin:0 auto; padding:0 25px;}
#movie .movie_wrap .movies{width:100%; padding:25px 80px;}
#movie .slick-prev, #gall .slick-prev {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    text-indent: -9999px;
    border: 0;
    background: url('../img/btn_prev1.png') no-repeat;
    width:19px;
    height: 39px;
}
#movie .slick-next,  #gall .slick-next{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    text-indent: -9999px;
    border: 0;
    background: none;
    background: url('../img/btn_next1.png') no-repeat;
     width:19px;
    height: 39px;
}

#gall{padding:50px 0 150px 0;}
#gall .gall_wrap{max-width:1350px; width:100%; margin:0 auto; padding:0 25px;}
#gall .gall_wrap .gall_latest{width:100%; padding:25px 80px;}
#gall .gall_wrap .gall_latest button{color:#fff;}
#gall .gall_wrap .gall_latest button:hover{color:#111;}

#gall .slick-initialized .slick-slide {
    display: block;
    margin: 0 0.4%;
    outline: none;
	background-color: #fffcf5;
}

#gall .btn-load-more{width:100%; border:1px solid #ccc; background:#fff; font-size:1.2em; display:inline-block; outline:none; padding:12px 0 20px 0; margin-top:40px; position:relative;}
#gall .btn-load-more:before{content:url('../img/b_arrow.png'); width:18px; height:9px; position:absolute; bottom:15px; left: 50%; transform: translateX(-50%);}
#gall .loadMore{display:block;}
#gall h3{font-size:1.2em;}


.con_tit{font-size: 2em; font-weight: 600; color: #222; margin-top:0; margin-bottom: 20px;}

footer{position:relative; overflow:hidden; padding:70px 0 40px 0;}
.footer_bg img{position:absolute; left:50%; top:0; transform:translateX(-50%); z-index:-1;}
footer .container{display:flex;}
.ft_info{padding-left:130px;}
.ft_info p{padding-bottom:3px; margin:0; display:flex; gap:15px;}
.ft_info p:last-of-type{padding-bottom:0; padding-top:10px;}
.ft_info p span{}

.cc{font-family : 'Nanum Gothic' !important;}

/*=================================================
		04. movie
=================================================*/

#movie img{width: 100%;}
.login_bg {width:100%; height:100%; background:rgba(0,0,0,0.6);position:fixed;display:none;}
.mov_window {width:500px; height:600px; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); background:#fff;}


/* , .mov_sb, .mov_sb1, .mov_sb2, .mov_sb3, .mov_sb4, .mov_sb5{width: 50%; height: 50%; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background: #fff; z-index: 9991; box-sizing: border-box; color: #525252;display: none;} */

.mov_sb0 {width: 50%; height: 50%; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background: #fff; z-index: 9991; box-sizing: border-box; color: #525252;display: none;}

.gal4, .gal7, .gal5, .gal6, .gal8, .pre1{width: 80%; height: auto; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background: #fff; z-index: 9991; box-sizing: border-box;  color: #525252;
	display: none;
}
.gal1{width: 15%; height: auto; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background: #fff; z-index: 9991; box-sizing: border-box;  color: #525252; display: none;
}
.gal2, .gal3 {width: 30%; height: auto; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background: #fff; z-index: 9991; box-sizing: border-box;  color: #525252; display: none;
}


.pro_mv {width: 400px; height: auto; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background: #fff; z-index: 9991; box-sizing: border-box;  color: #525252;
	display: none;
}
#movie .video_u {margin-bottom: 20px;}

#movie .muzi {float: left; width: 50%;}
#movie .muzi audio {width: 80%;}


/*****#####===== 미디어 쿼리 =====#####*****/
/***** xs *****/

@media (max-width: 767px){

    #movie .video {margin-bottom: 20px;}
    .quizT, .tk_tw_us, .tv0816, .hidden1 {width: 600px;}
    .gal1{width: 30%;}
    .gal2, .gal3 {width: 60%;}
}

@media (max-width: 480px){
    .quizT, .tk_tw_us, .tv0816, .hidden1 {width: 400px;}
    .pro_mv {width: 300px;}
    .gal2, .gal3 {width: 80%;}
    .gal1{width: 40%;}
}



#map {
	/* width: 1170px; */width:100%; height: 450px; margin: 0 auto; border: 1px solid #ccc;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** xs *****/
@media (max-width: 767px){
	#map {
		width: 100%;
		height: 300px;
	}
}

.flex{display:flex; justify-content:space-between; align-items: center;}


/* popup */
#divpop { position: absolute; width:400px; height:600px; position: absolute; top:35%; left:10%; margin-top:-200px; background:#fff; z-index:15000;}
#divpop .cont {width:400px; height:600px;}
#divpop .close {width:400px; height:30px; background:#f3f3f3; line-height:30px; padding-left:10px; font-size:13px; opacity: 1;}
#divpop .close #close {float:right; margin-right:10px; cursor:pointer;}

#divpop1 { position: absolute; width:600px; height:880px; position: absolute; top:25%; left:50%; margin-top:-200px; background:#fff; z-index:15000;}
#divpop1 .cont1 {width:600px; height:880px;}
#divpop1 .close1 {width:600px; height:30px; background:#f3f3f3; line-height:30px; padding-left:10px; font-size:13px; opacity: 1;}
#divpop1 .close1 #close1 {float:right; margin-right:10px; cursor:pointer;}

#divpop2 { position: absolute; width:600px; height:600px; position: absolute; top:30%; left:35%; margin-top:-200px; background:#fff; z-index:15000;}
#divpop2 .cont2 {width:600px; height:600px;}
#divpop2 .close2 {width:600px; height:30px; background:#f3f3f3; line-height:30px; padding-left:10px; font-size:13px; opacity: 1;}
#divpop2 .close2 #close2 {float:right; margin-right:10px; cursor:pointer;}



@media (max-width: 1400px){
	#mprocess .container > img{width:300px}
}

@media (max-width: 1200px){
	#main_bn{padding-bottom:40px;}
	#introduce .cp_txt{width:60%;}
	#introduce .cp_txt p{padding-right:0;}
	.nav_container{padding:0 20px;}

	.cp_bg img{width:150%;}

	.nav_container.flex a.logo img {width: 180px;}
	.con_tit { font-size: 1.5em}

	.cp_img{width:30%}
	.cp_img img{width:100%;}
	.cp_txt img{max-width:300px; }

	#patent{ padding: 60px 0 180px 0;}
	.process_bg1{width:140%;}

	.ft_info{padding-left:80px;}
}


@media (max-width: 1024px){
	body section{padding:120px 0 }

	.nav_container .nav_flex_wrap .nav_flex{gap:40px;}
	.nav_container ul li a{font-size:1.1em;}

	#main_bn{padding-bottom:0;}
	.slick-dotted.slick-slider{margin-bottom:0;}
	
	.cp_bg img{width:160%;}
	.cp_txt p{padding-bottom:0;}

	#introduce .container{padding:80px 25px;}
	#introduce .cp_txt{width:100%;}

	#cservice .cs_bg{background:none;}
	#cservice .cs_txt ul{padding:30px 0; margin:0;}
	#cservice .cs_txt, #cservice .mapwrap{width:100%; padding:0;}
	#cservice .mapwrap .mapdiv .wrap_map{height:300px;}

	#method .method_wrap .method_txt_wrap{width:50%; text-align:left; padding-top:20px}
	#method .slick-dots{margin-top:0;}

	#cservice .flex{flex-direction: column;}
	#map{height:350px;}
	.cs_txt ul li{padding-bottom:0;}

	.process_bg1{width:160%;}

	footer .container { display: flex; flex-direction: column;}
	.ft_info{padding-left:0; padding-top:15px;}
}

@media (max-width: 820px){
	.slick-dots{bottom:40px;}

	#introduce{padding:80px 0;}
	.cp_bg img{width:260%;}

	.simple-menu{padding:15px 0 8px 0;}
	.nav_container{height:auto; line-height:auto; }

	#main_bn {padding-bottom: 60px;}
	#main_bn .mnone{display:none;}
	#main_bn .pcnone{display:block;}

	.process_bg1{width:280%;}
	.process_bg2{width:240px;}
	
	#mprocess .container > img{width:220px; margin-bottom:50px;}
	#mprocess .mp_img .pcnone{margin:0;}
	#mprocess .container {display: flex; align-items: center; flex-direction: column;}
	.mp_txt h2, .mp_txt p{text-align:center; padding-left:0;}
	.pop_video button { margin-left: 0;  margin:0 auto; margin-top:40px; width: 140px; height: 40px; font-size:1em;}

	.nav_top, .nav_container{padding:10px 10px 0 10px;}
	.nav_container{padding:0 25px}
	.nav_flex_wrap{height: 35px; line-height: 35px; margin:0;}
	.nav_container .nav_flex_wrap .nav_flex{display:flex !important; width:100% !important; position:static !important; margin: 0; padding-top:25px; gap: 0;} 
	.nav_container.flex{display:block;}
	.nav_container.flex a.logo{margin:5px auto;display:block;}
	.nav_container.flex a.logo img{width:140px; display: block; margin: 0 auto; text-align: center;}
	.nav_container .nav_flex_wrap{width: 100%;}
	.nav_container .mediPlayer {margin: 6px 0 0 20px;}
	
	#introduce .container { flex-direction: column;}
	.cp_txt{padding-top:0;}
	.cp_txt strong, .cp_txt p{ width:80%; margin:0 auto;}

	#intro_bn .flex{flex-direction: column;}
	#intro_bn .intro_img, .intro_txt{width:100%;}
	#intro_bn .intro_img img{max-width:180px;}
	#intro_bn .intro_txt{text-align:center; padding-top:10px;}
	#intro_bn .intro_txt h2{font-size:2em;}
	#intro_bn .intro_txt p{font-size:1.2em;}

	#method{width:100%; display:flex; flex-direction: column-reverse; padding:0; height:560px;}
	#method .method_wrap{width:100%; padding:0; background: #d6c3a2;}
	#method .method_wrap .method_txt_wrap{width:100%; top:200px;}
	#method .method_img{width:100%; height:200px}
	#method .slick-dots{margin-top:10px;}

	#gall{padding: 0px 0 25px 0;}
	#gall { padding: 20px 0 80px 0; }
	#gall .loadMore{display:block;}
	
	.way_txt p br{display:none;}

	#movie {width: 100%; padding: 80px 0 25px 0;}


	#mprocess .mp_img .mnone{display:none;}
	#mprocess .mp_img .pcnone{display:block; max-width:350px; width:100%; margin:0 auto;}

	.ft_info p:nth-of-type(3) span{display:block;}
}
@media (max-width: 768px){
	.cp_bg img{width:380%;}
}

@media (max-width: 600px){

	.slick-dots {bottom: -20px;}
	.con_tit {font-size: 1.3em; margin-bottom: 0;}

	.nav_container .mediPlayer {margin: 6px 0 0 15px;}
	#introduce .container{gap:20px; padding: 20px 25px 40px 25px;}

	#introduce{padding:80px 0 40px 0;}
	#introduce .cp_txt .cp_box img{width: 320px; bottom: 100px;}
	.cp_txt > img{width:240px; padding-top:20px;}
	
	.cp_bg img {width: 400%;}
	.cp_txt strong, .cp_txt p {width: 100%; padding: 0;}
	.cp_txt strong{padding-bottom:20px;}
	
	 #patent {padding: 60px 0 60px 0;}
	#patent ul{margin:0 auto; padding:25px;}
	#patent ul li{width:48%; padding:0 1.5%}
	#patent ul li:nth-child(1), #patent ul li:nth-child(2){margin-bottom:15px;}

	#movie .movie_wrap{} 

	#gall{}

	.nav_container .mediPlayer {margin: 6px 0 0 5px;}
	.nav_container .nav_flex_wrap .nav_flex li{vertical-align:middle;}
	.nav_container .nav_flex_wrap .nav_flex li:nth-child(3){line-height:22px;}
	.nav_container .nav_flex_wrap .nav_flex li span{display:block; line-height:1.0em;}

	#introduce .cp_txt .cp_box img{width: 250px; bottom: 145px;}
	#introduce .cp_txt .cp_box h2{padding-top: 35px; font-size:2em;}
	#introduce .cp_txt .cp_box h3{padding-top:5px; font-size:1.3em; line-height:1.4em;}
	#introduce .cp_txt p{ line-height: 1.5em; font-size:1em;}
	#introduce .cp_txt .cp_box {height:330px;}

	#method{height:520px;}
	#method .method_wrap .method_txt_wrap{top:160px; padding-top:0}
	#method .method_txt_wrap .method_txt h3{font-size:1.8em; line-height:1.5em; margin-top:10px; margin-bottom:15px;}
	#method .method_txt_wrap .method_txt p{line-height:1.5em;}
	#method .method_img{height:160px}
	#method .slick-dots{margin-top:0;}

	#mprocess p{font-size:1.1em;}
	#mprocess p br{display:none;}
	#mprocess a, .pop_video button{}
	.process_bg1{width:450%;}
	.process_bg2 { width: 150px; top:0;}
	#mprocess .container > img{width:150px; margin-bottom:30px;}
	
	.way_txt h3{font-size:1.2em;}
	.way_txt_wrap:nth-of-type(1){flex-direction: column-reverse;}
	.way_txt_wrap:nth-of-type(2){flex-direction: column;}
	.way_txt {text-align: left; width: 100%;}

	#movie{padding:0 0 50px 0;}
	#movie .movie_wrap{max-width:1350px; width:100%; margin:0 auto; padding:0 10px;}
	#movie .movie_wrap .movies{width:100%; padding:25px 35px;}
	#movie .con_tit{margin-bottom:0;}
	
	#gall .gall_wrap{padding:0 10px;}
	#gall .gall_wrap .gall_latest{width:100%; padding:25px 35px;}
	
	#cservice { padding: 60px 0 100px 0;}
	#cservice .cs_txt h3{font-size:1.6em;}
	#cservice .cs_txt .cs_txt h3 span{font-size:0.5em;}
	#cservice .cs_txt h3 img{width:50px;}
	#cservice .cs_txt ul{padding:30px 0;}
	#cservice .cs_txt ul li{padding-bottom:0; font-size:1em;}
	#cservice .cs_txt ul li span{width:30%;}
	#cservice .cs_txt ul li b{width:70%;  color: #000; font-weight: 700;}

	#gall .container{padding:0;}

	#map{height:240px;}

	.con_tit{font-size:1.2em;}
	.ft_info p:nth-of-type(3){flex-direction: column; gap: 0;}
	footer {padding: 0 0 40px 0; background-image: linear-gradient(to bottom, transparent 50%, #d3c6aa 50%);}
	.ft_logo{padding-top:70px;}
	.footer_bg img{width:500%;}
	.slick-dots li button:before, .slick-dots li.slick-active button:before { width: 10px; height: 10px; background-size: 100%;	}
}