.main_wrap { letter-spacing: -1px; min-width: 320px; background-color:#f9f9f9; }
.main_wrap img { max-width: 100%; }
.color_pink { color: #cf2447; }






/*header*/
.nav_bg { background: rgba(0,0,0,0.5); position: fixed; width: 100%; height: 100%; z-index: 9; left:0; top:0; display: none; }


.hd_mob { display:none; position:fixed; top:0; width: 100%; left: 0; padding: 80px 85px 0 60px; z-index: 10;}
.hd_mob h1 { float:left; margin-top: -30px; display: flex;align-items: center;}
.hd_mob h1 img { max-width: 100%; }
.hd_mob h1 .logo_white { display: block; } 
.hd_mob .nav_open { float:right; position: relative; width: 30px; height:22px; display:block; border:0; background: transparent; cursor: pointer; z-index:11; transition: 0.5s;}
.hd_mob .nav_open span { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; height: 2px; background: #cf2447; transition: 0.5s; }
.hd_mob .nav_open span:first-child { top:0; opacity:1; transform: translate(0); }
.hd_mob .nav_open span:last-child { top: auto; bottom: 0; transform: translate(0); }


.hd_mob h1 .logo_100th{width: 143px;margin-left: 25px;}


/*header - blue_ver*/
/* .hd_mob.blue h1 .logo_blue { display: block; }
.hd_mob.blue h1 .logo_white { display: none; } 
.hd_mob.blue .nav_open span { background: #005cb9; } */



/*닫기*/
.hd_mob .nav_open.on{ height: 30px; }
.hd_mob .nav_open.on span { background: #fff; }
.hd_mob .nav_open.on  span:first-child { transform: rotate(45deg) translateY(-50%); top: 50%;}
.hd_mob .nav_open.on  span:nth-child(2) { opacity:0; }
.hd_mob .nav_open.on  span:last-child { transform: rotate(-45deg) translateY(-50%); top: 50%;}


.hd_mob .nav_mob { position: fixed; right: -100%; top:0; width: 100%; max-width: 400px; height: 100%; z-index: 10; text-align:center;  padding: 220px 0; font-size: 30px; font-weight: bold; background: #cf2447; color:#fff;transition: 0.5s;}
.hd_mob .nav_mob.on { right: 0; }

.hd_mob .nav_mob a { display: inline-block; width: auto; padding-bottom: 2px; margin-bottom: 30px; position: relative; padding-bottom: 5px; }
.hd_mob .nav_mob > ul > li:nth-child(4) > a{display: none;}
.hd_mob .nav_mob a:after { content: ""; position: absolute;
    left: 0;
    bottom: 0;
    width: 0%;
    height: 1px;
    background: rgba(255,255,255,0.2);
    transition: 0.3s;  }
.hd_mob .nav_mob a:hover:after { width: 100%; }



/*전체 레이아웃*/
.main_wrap .swiper-container.wrap_slider { height: 100vh; overflow:hidden; font-family:'Nanum Square', 'Noto Sans KR', sans-serif; }
.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide { height: 100vh; overflow: hidden; }


/*니코틴 의존도 검사하기*/
.nico_test { position:fixed; left: 55px; bottom: 80px;  z-index:1; transition: transform 0.3s; }
.nico_test img,.nico_test > span ,.nico_test > a{ display: inline-block; vertical-align:middle; }
.nico_test img { box-shadow: 0 5px 10px rgba(0,0,0,0.1); border-radius: 50%; }
.nico_test .nico_txt { display: inline-block; text-align: left;  height: 50px; line-height: 50px; font-weight: bold;/*  font-family:'Noto Sans KR', sans-serif; */ color:#fff; font-size: 14px; border-radius: 12px; background: #cf2447; position: relative; margin-left: 15px; 
	max-width: calc(100% - 110px);
	width: 191px;
	white-space:nowrap;
	/* animation-name: nico;
	animation-duration:2s;
	animation-direction: alternate;
	animation-timing-function: steps(30);
	animation-fill-mode: both; */
}
.nico_test .chat_text{
	padding: 0 20px;
}
.nico_test span:after { content: ""; display:block; position: absolute; border-right: 5px solid #cf2447; border-top: 5px solid transparent; border-bottom: 5px solid transparent; top: 50%; left: -5px; transform: translateY(-50%); }


/*니코틴 애니메이션*/
@keyframes nico {
	0% { width: 0; overflow: hidden; }
	98% { overflow: hidden; }
	100% { width: 191px; overflow: visible; }
}




/*챗봇*/
.chatBot { position:fixed; right: 65px; bottom: 80px; text-align: right; z-index:1;  transition: transform 0.3s; }
.chatBot img,.chatBot > span ,.chatBot > a{ display: inline-block; vertical-align:middle; }
.chatBot img { box-shadow: 0 5px 10px rgba(0,0,0,0.1); border-radius: 50%; }
.chatBot .chat_txt { display: inline-block; text-align: left;  height: 50px; line-height: 50px; font-weight: bold;/*  font-family:'Noto Sans KR', sans-serif; */ color:#fff; font-size: 14px; border-radius: 12px; background: #37bfb3; position: relative; margin-right: 15px; max-width: calc(100% - 110px);
	width: 350px;
	white-space:nowrap; overflow: hidden;
	animation-name: chat;
	animation-duration:2s;
	animation-direction: alternate;
	/* animation-iteration-count: 3; */
	/* animation-timing-function: ease-in-out; */
	animation-timing-function: steps(30);
	animation-fill-mode: both;
}
.chatBot .chat_text{
	padding: 0 20px;
}

.chatBot span:after { content: ""; display:block; position: absolute; border-left: 5px solid #37bfb3; border-top: 5px solid transparent; border-bottom: 5px solid transparent; top: 50%; right: -5px; transform: translateY(-50%); }


/*챗봇 애니메이션*/
@keyframes chat {
	0% { width: 0; overflow:hidden; }
	98%{overflow: hidden;}
	100% { width: 325px; overflow:visible; }
}



/* 페이지네이션 왼쪽 */
.main_wrap .swiper-container .swiper-pagination { right: auto; left: 85px; top: 0; position:fixed; height: 100%; transition: 0.3s; }
.main_wrap .swiper-pagination:before { content: "";  width: 1px; height: 100%; background: rgba(34,36,37,0.03); transition: 0.3s; position: absolute; left: 4px; top: 0; }
.main_wrap .swiper-pagination-inner { position: absolute; top: 50%; transform: translateY(-50%); }

.main_wrap .swiper-pagination-bullet { width: 8px; height: 8px; border-radius: 50%; background: #cf2447; opacity: 1; position: relative; margin: 16px 0; }
.main_wrap .swiper-pagination-bullet .leftMenu { left: 27px; top: 50%; transform: translateY(-50%); color: rgba(255,255,255,0.1); font-size: 13px; text-align:left; width: 120px; font-family: 'Noto Sans KR', sans-serif; font-weight: 500; position:absolute; color:#73787d;}
.main_wrap .swiper-pagination-bullet-active:before { content:""; width: 20px; height: 20px; border-radius: 50%;  border: 1px solid rgba(200,16,79,0.3); position:absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.main_wrap .swiper-pagination-bullet-active .leftMenu { color: #cf2447; font-weight: bold; }
.main_wrap .swiper-pagination-bullet:last-child{ display: none; }



/*네비게이션 오른쪽*/
.main-button-wrap { position: fixed; right: 83px; top: 0; height: 100%; z-index: 1; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; transition: 0.3s; } 
.main-button-wrap:before { content: ""; position: absolute; right: 16px; width: 1px; height: 100%; background: rgba(34,36,37,0.08); }
.main-button-wrap .swiper-button-next, .main-button-wrap  .swiper-button-prev { position: static; width: 32px; height: 30px; margin-top: 0; background-color: #fff; background-position: 50%; background-repeat: no-repeat; background-size: 10px 6px;}
.main-button-wrap .swiper-button-next.swiper-button-disabled, .main-button-wrap .swiper-button-prev.swiper-button-disabled { opacity: 1; }

.main-button-wrap .swiper-button-prev, .main-button-wrap .swiper-container-rtl .swiper-button-next{ background-image: url('../images/main/right_arr_up.png'); border-radius: 16px 16px 0 0; border-bottom: 1px solid rgba(255,255,255,0.15); background-color: #cf2447; }
.main-button-wrap .swiper-button-next, .main-button-wrap  .swiper-container-rtl .swiper-button-prev{ background-image: url('../images/main/right_arr_down.png'); border-radius: 0 0 16px 16px; background-color: #cf2447; }









/*sec01*/
.main_wrap .sec01 { background: url('../images/main/sec01_bg.png') 50% no-repeat; background-size: cover; color: #222425;} 
.main_wrap .sec01 .inner_1200 { padding: 50px 0 0; height: 100vh; }

.main_wrap .sec01 .sec01_mob { display: none; }
.main_wrap .sec01 .sec01_pc	.sec01_tit_wrap { position: relative; z-index: 2; overflow: hidden; padding: 0 20px; }
.main_wrap .sec01 .sec01_pc	.sec01_tit01 { float: left; margin-top: 60px; }
.main_wrap .sec01 .sec01_pc	.sec01_tit02 { float: right; }
.main_wrap .sec01 .sec01_pc	.sec01_prds { /* position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 1; */  }

.main_wrap .sec01 header .hd_pc { margin-bottom: 40px; text-align: center; }
.main_wrap .sec01 header .hd_pc h1 { margin-bottom: 30px; }
.main_wrap .sec01 header .hd_pc nav { text-align:center;  }
.main_wrap .sec01 header .hd_pc nav a { display: inline-block; font-size: 18px; font-weight: bold; margin-right:70px; color:#595959; position: relative; padding-bottom: 5px; }
.main_wrap .sec01 header .hd_pc nav a:nth-child(4){display: none !important;}
.main_wrap .sec01 header .hd_pc nav a:last-child { margin-right: 0; }
.main_wrap .sec01 header .hd_pc nav a:after { content:""; position: absolute; left: 0; bottom: 0; width: 0%; height: 1px; background: #595959; transition:0.3s; }
.main_wrap .sec01 header .hd_pc nav a:hover:after { width: 100%; }

.main_wrap .sec01 header .hd_pc .logo_100th{position: absolute;top: 65px;left: 90px;width: 250px;display: inline-block;}


.sce01_iframe { position: relative; height: 0; padding-bottom: 56.25%; margin: 40px 0; overflow: hidden;  }
.sce01_iframe iframe { position:absolute; width: 100%; height: 100%; top: 0; left: 0;}

 
.main_wrap .scroll_down { position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%); z-index: 2; 
animation-name: scrollDown;
animation-iteration-count: infinite;
animation-duration: 1s;
animation-direction: alternate;
animation-timing-function: ease-in-out;
}


/*sec02*/
.main_wrap .sec02 { display: flex; align-items: center; }
.main_wrap .sec02 .inner_1200 {  }
.main_wrap .sec02 .sec02_txt { float: left; }
.main_wrap .sec02 .sec02_txt { width: 800px; }
.main_wrap .sec02 .sec02_img { width: calc(100% - 800px); text-align: right; float: right; padding-top: 55px; }


.main_wrap .sec02 .sec02_txt .top .title_head { font-size: 25px; color:#cf2447; border-bottom: 1px solid; display: inline-block; font-weight: 900;  }
.main_wrap .sec02 .sec02_txt .top .title_big	{ font-size: 60px; font-weight: 900; padding: 10px 0 20px; letter-spacing: -5px; }  
.main_wrap .sec02 .sec02_txt .top .rel_box { position: relative; display: inline-block; padding: 0 20px 0 10px; }
.main_wrap .sec02 .sec02_txt .top .rel_box .hidden_box { max-width: 100%; position: absolute; left: 0; bottom: -9px; cursor:pointer; }

.main_wrap .sec02 .sec02_txt .top .txt_wrap { line-height: 1.5; }
.main_wrap .sec02 .sec02_txt .top .txt_wrap p { font-size: 20px; }
.main_wrap .sec02 .sec02_txt .top .txt_wrap p.txt_wrap_info { padding-top: 5px; color:#73787d; font-size: 15px; }

.main_wrap .sec02 .sec02_txt .bottom p { font-weight: 900; font-size: 70px; letter-spacing: -6px; margin-top: 40px; padding: 28px 50px; border: 5px solid #cf2447; border-radius: 45px; display: inline-block; }
.main_wrap .sec02 .sec02_txt .bottom p img { vertical-align: middle; margin: -5px 0 0 -5px; }
.main_wrap .sec02 .sec02_txt .bottom p .question { font-weight: 900; color: #cf2447; }
.main_wrap .sec02 .sec02_txt .bottom a { display: inline-block; padding: 15px 40px; border-radius: 30px; font-size: 25px; color:#fff; font-weight: bold; background: #cf2447; box-shadow: 10px 10px 30px rgba(0,0,0,0.1); margin: -25px 0 0 40px; }
.main_wrap .sec02 .sec02_txt .bottom a img { display: inline-block; margin-left: 25px; margin-top: -5px; }


/* title animation */
.main_wrap .sec02 .sec02_txt { opacity:0; transform: translateX(-500px); transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99), opacity .8s ease-in-out; }
.main_wrap .sec02.swiper-slide-active .sec02_txt { opacity: 1; transform: translateX(0); }





/* sec 03 */

.main_wrap .sec03 { display: flex; align-items: center; background: url('../images/main/sec03_bg.png') 50% no-repeat; background-size: cover; }
.main_wrap .sec03 .sec03_tit { display: block; margin: 0 auto; }
.main_wrap .sec03 .sec03_answer	{ text-align: center; margin-top: 26px;}
.main_wrap .sec03 .sec03_answer a { display: inline-block; margin-right: 30px; max-width: calc(50% - 34px); }
.main_wrap .sec03 .sec03_answer a:last-child { margin-right: 0; }

/*섹션3 효과 적용*/
.main_wrap .sec03 .sec03_tit {transform: translateY(500px); opacity:0; transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99),opacity .8s ease-in-out;}
.main_wrap .sec03.swiper-slide-active .sec03_tit { transform: translateX(0); opacity:1; }



/*sec04*/
.main_wrap .sec04 { display: flex; align-items: center; }
.main_wrap .sec04 .prd_txt ,  .main_wrap .sec04 .prd_img { float: left;  }
.main_wrap .sec04 .prd_txt { width: 600px; padding-left: 50px; }
.main_wrap .sec04 .prd_img { width: calc(100% - 600px); }
.main_wrap .sec04 .prd_img img { max-width: 100%; }


.main_wrap .sec04 .prd_txt .title { font-size: 60px; font-weight: 900; margin-bottom: 43px; }
.main_wrap .sec04 .prd_txt .prd_benefits { font-size: 30px; font-weight: 900; }
.main_wrap .sec04 .prd_txt .prd_benefits img { display: inline-block; vertical-align: middle; margin-right: 10px; }
.main_wrap .sec04 .prd_txt .prd_benefits li { margin-bottom: 15px; }

.prd_btn_wrap { margin-top: 45px; }
.prd_btn_wrap a { display: inline-block; width: 240px; height: 50px; line-height: 50px; border-radius: 25px; background: #37bfb3; color:#fff; font-weight: bold; font-size: 20px; margin-right: 10px; text-align:center;}
.prd_btn_wrap a:last-child { margin-right: 0; }

/* title animation */
.main_wrap .sec04 .prd_txt { opacity:0; transform: translateX(500px); transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99), opacity .8s ease-in-out; }  
.main_wrap .sec04.swiper-slide-active .prd_txt { opacity: 1; transform: translateX(0); }


/*sec04_1*/
.main_wrap .sec04_1 { display: flex; align-items: center; }
.main_wrap .sec04_1 .title_wr { text-align: center; margin-bottom: 45px;}
.main_wrap .sec04_1 .title { font-size: 60px; font-weight: 900; margin-bottom: 15px; }
.main_wrap .sec04_1 .sub_title { display: inline-block; width: 515px; height: 50px; line-height: 50px; background: #cf2447; background-size: cover; font-size: 34px; font-weight: 900; color:#fff; }
.main_wrap .sec04_1 .box_wrap03 .boxes { border-radius: 10px; padding: 50px 0 40px; width: 25%; float: left; text-align: center; } 
.main_wrap .sec04_1 .box_wrap03 .boxes .txt_area { padding: 45px 0% 0 0; font-size: 20px; word-break:keep-all; line-height: 1.5; }
.main_wrap .sec04_1 .box_wrap03 .box01 .txt_area { }
.main_wrap .sec04_1 .box_wrap03 .box02 .txt_area { padding-left:10px; }
.main_wrap .sec04_1 .box_wrap03 .box03 .txt_area { padding-left:15px; }
.main_wrap .sec04_1 .box_wrap03 .box04 .txt_area { padding-left:20px; }
/*
*/

/* title animation */
.main_wrap .sec04_1 .title_wr { opacity:0; transform: translateY(-500px); transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99), opacity .8s ease-in-out; }  
.main_wrap .sec04_1.swiper-slide-active .title_wr { opacity: 1; transform: translateY(0); }





/*sec05*/
.main_wrap .sec05 { display: flex; align-items: center; }
.main_wrap .sec05 .inner_1200 { padding-top: 100px; }
.main_wrap .sec05 .prd_txt { float: left;  }
.main_wrap .sec05 .prd_img { float:right; }
.main_wrap .sec05 .prd_txt { width: 600px; }
.main_wrap .sec05 .prd_img { width: calc(100% - 600px); text-align: right;}
.main_wrap .sec05 .prd_img img { max-width: 100%; }



.main_wrap .sec05 .prd_txt .title { font-size: 60px; font-weight: 900; margin-bottom: 43px; }
.main_wrap .sec05 .prd_txt .prd_benefits { font-size: 32px; font-weight: 900; }
.main_wrap .sec05 .prd_txt .prd_benefits img { display: inline-block; vertical-align: middle; margin-right: 10px; }
.main_wrap .sec05 .prd_txt .prd_benefits li { margin-bottom: 10px; }

.han_ja { font-family: sans-serif; }


/* title animation */
.main_wrap .sec05 .prd_txt { opacity:0; transform: translateX(-500px); transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99), opacity .8s ease-in-out; }  
.main_wrap .sec05.swiper-slide-active .prd_txt { opacity: 1; transform: translateX(0); }




/*sec06*/
/*
.main_wrap .sec06 .title { font-size: 60px; font-weight: 900; margin-bottom: 35px; }
.main_wrap .sec06 .sub_title { display: inline-block; width: 600px; height: 50px; line-height: 50px; border-radius: 25px;  background: #cf2447; background-size: cover; font-size: 30px; font-weight: 900; color:#fff; }
*/
.main_wrap .sec04_1,
.main_wrap .sec06 { display: flex; align-items: center; }
.main_wrap .sec04_1 .title_wr,
.main_wrap .sec06 .title_wr { text-align: center; margin-bottom: 45px;}
.main_wrap .sec04_1 .title,
.main_wrap .sec06 .title { font-size: 60px; font-weight: 900; margin-bottom: 15px; }
.main_wrap .sec04_1 .sub_title,
.main_wrap .sec06 .sub_title { display: inline-block; width: 515px; height: 50px; line-height: 50px; background: #cf2447; background-size: cover; font-size: 34px; font-weight: 900; color:#fff; width:auto;padding:0 33px; }


/*.main_wrap .sec04_1 .box_wrap03 .boxes,*/
.main_wrap .sec06 .box_wrap03 .boxes { border-radius: 10px; padding: 50px 0 40px; width: 33.333%; float: left; text-align: center; } 
.main_wrap .sec06 .box_wrap03 .box01 .img_area { } 
.main_wrap .sec06 .box_wrap03 .box02 .img_area {  }
.main_wrap .sec04_1 .box_wrap03 .box03 .img_area,
.main_wrap .sec06 .box_wrap03 .box03 .img_area	{ margin-left: 10%; }

.main_wrap .sec04_1 .box_wrap03 .boxes .img_area img,
.main_wrap .sec06 .box_wrap03 .boxes .img_area img { max-width: 382px;  }

.main_wrap .sec04_1 .box_wrap03 .boxes .txt_area,
.main_wrap .sec06 .box_wrap03 .boxes .txt_area { padding: 45px 20% 0 0; font-size: 20px; word-break:keep-all; line-height: 1.5; } 
.main_wrap .sec06 .box_wrap03 .box02 .txt_area { padding: 45px 0 0 10%; }
.main_wrap .sec06 .box_wrap03 .box03 .txt_area { padding: 45px 0 0 5%; }




.main_wrap .sec04_1 .box_wrap03 .box01 .txt_area{padding-right:5%;}
.main_wrap .sec04_1 .box_wrap03 .box02 .txt_area{padding-right:0;}
.main_wrap .sec04_1 .box_wrap03 .box03 .txt_area{padding-right:0;margin-left:40px;}
.main_wrap .sec04_1 .box_wrap03 .box04 .txt_area{padding-right:0;margin-left:25px;}




/* title animation */
.main_wrap .sec06 .title_wr { opacity:0; transform: translateY(-500px); transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99), opacity .8s ease-in-out; }  
.main_wrap .sec04_1.swiper-slide-active .title_wr,
.main_wrap .sec06.swiper-slide-active .title_wr { opacity: 1; transform: translateY(0); }




/*sec07*/
.main_wrap .sec07 { display: flex; align-items: center; }
.main_wrap .sec07 .inner_1200 { }
.main_wrap .sec07 .title { color: #222425; font-size: 60px; margin-bottom: 60px; font-weight: 900; text-align: center; }
.main_wrap .sec07 .title .color_pink { color: #cf2447; }

.main_wrap .sec07 .clock_wrap { width: 100%; max-width: 420px; height: 420px; position: relative; margin: 0 auto; background: url(../images/main/sec07_clock.png) no-repeat 50%; background-size: 100%; border-radius: 50%;  }
.main_wrap .sec07 .clock_stick { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-90deg); max-width: 70%; transition: 0.5s; }


  /* blets */
.main_wrap .sec07 .blet_wrap { display: inline-block; position: absolute; left: 78%; top: 17%; opacity: 0.5; transition: 0.5s; }
.main_wrap .sec07 .blet_wrap .blet{ display: inline-block; border-radius: 50%; box-shadow: 0 0 10px 10px rgba(200,16,79,0.4); position: relative;}
.main_wrap .sec07 .blet_wrap .blet:after { content:""; display: block; border-radius: 50%; width: 32px; height: 32px; border: 2px solid #cf2447; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.main_wrap .sec07 .blet_wrap .clock_title_wrap { position: absolute; left: 50%; top: 50%; }
.main_wrap .sec07 .blet_wrap .clock_txt_wrap { position: absolute; left: 100%; top: -20px; }
.main_wrap .sec07 .blet_wrap .clock_txt_wrap .clock_tit { width: 120px; height: 40px; line-height: 40px; background: #cf2447; color:#fff; font-weight: 900; text-align: center; display:inline-block; font-size: 20px; border-radius: 20px; }
.main_wrap .sec07 .blet_wrap .clock_txt_wrap .clock_txt { padding: 20px 0; font-size: 20px; width: 400px; font-weight: bold; }


	/* animation */
.main_wrap .sec07 .blet_wrap.on { opacity: 1; }


/* title animation */
.main_wrap .sec07 .title { opacity:0; transform: translateY(500px); transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99), opacity .8s ease-in-out; }  
.main_wrap .sec07.swiper-slide-active .title { opacity: 1; transform: translateY(0); }



  /* blests 위치조정 */
.main_wrap .sec07 .blet_wrap01 { text-align: left; left: 78%; top: 17%; }
.main_wrap .sec07 .blet_wrap02 { text-align: left; left: 91%; top: 47.5%; }
.main_wrap .sec07 .blet_wrap03 { text-align: left; left: 78%; top: 78.5%; }

.main_wrap .sec07 .clock_title_wrap	> img { width: auto; max-width: 200px; }
.main_wrap .sec07 .blet_wrap01 .clock_title_wrap  { top: -140%;}
.main_wrap .sec07 .blet_wrap02 .clock_title_wrap  { top: 50%; transform: translateY(-50%);}
.main_wrap .sec07 .blet_wrap03 .clock_title_wrap  { top: 50%; }
.main_wrap .sec07 .blet_wrap03 .clock_txt_wrap { top: 20px;}


.main_wrap .sec07 .blet_wrap04 { text-align: right; left: 15.5%; top: 78.5%; }
.main_wrap .sec07 .blet_wrap05 { text-align: right; left: 4%;; top: 47.5%;}
.main_wrap .sec07 .blet_wrap06 { text-align: right; left: 17%; top: 17%;}

.main_wrap .sec07 .blet_wrap04 .clock_title_wrap { left: auto; right: 50%; top: 50%; }
.main_wrap .sec07 .blet_wrap04 .clock_txt_wrap { left: auto; right: 100%; top: 20px;}

.main_wrap .sec07 .blet_wrap05 .clock_title_wrap  { left: auto; right: 50%; top: 50%; transform: translateY(-50%);}
.main_wrap .sec07 .blet_wrap05 .clock_txt_wrap { left: auto; right: 100%; }

.main_wrap .sec07 .blet_wrap06 .clock_title_wrap  { left: auto; right: 50%; top: -140%; }
.main_wrap .sec07 .blet_wrap06 .clock_txt_wrap { left: auto; right: 100%; }






/* sec08 */
.main_wrap .sec08 { display:flex; align-items:center; }
.main_wrap .sec08 .inner_1200 {}
.main_wrap .sec08 .title { color: #222425; font-size: 60px; margin-bottom: 60px; font-weight: 900; text-align: center; }
.main_wrap .sec08 .box_wrap03 { display:flex; justify-content: space-between; text-align:center; }
.main_wrap .sec08 .box_wrap03 .boxes { width: calc(33.3333% - 40px); }
.main_wrap .sec08 .box_wrap03 .boxes img { max-width: 100%; }
.main_wrap .sec08 .box_wrap03 .boxes .txt_area { padding-top: 25px;  }
.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_tit { font-size: 35px; font-weight: 900; margin-bottom: 15px; }
.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_txt { font-size: 20px; color:#73787d; }
.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_tit .color_green { color: #009985; }
.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_tit .color_red { color: #e21b41; }
.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_tit .color_blue { color: #0b74b2; }


/* title animation */
.main_wrap .sec08 .title { opacity:0; transform: translateX(500px); transition: transform 0.8s cubic-bezier(0.16, 0.68, 0.43, 0.99), opacity .8s ease-in-out; }  
.main_wrap .sec08.swiper-slide-active .title { opacity: 1; transform: translateX(0); }



/*푸터*/
.main_ft { background: #cf2447; color: #fff; font-size: 16px; letter-spacing: -0.06rem; }
.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.main_ft { height: 150px; display:flex; align-items: center; box-sizing:border-box; }
.main_ft .left { float:left; width: 213px;}
.main_ft .right { float: right; width:  calc(100% - 273px); }
.com_info{margin-bottom: 5px; }
.com_info p { float: left; padding: 0 23px; position:relative; }
.com_info p:first-child { padding-left: 0; }
.com_info p:last-child { padding-right: 0; }
.com_info p:after { content:""; width: 1px; height: 12px; background: rgba(255,255,255,0.1); position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.com_info p:last-child:after{ display: none; }
.main_ft .copy{ font-size: 13px; line-height:30px; letter-spacing:0; text-transform: uppercase;}
.main_ft .copy b{ }







/*반응형=====================================================================================================================================================*/
@media(max-width : 1800px){
.main_wrap .swiper-container .swiper-pagination { left: 40px; }
.main-button-wrap { right: 40px; }

.hd_mob{ padding:80px 40px 0 60px; }
.chatBot { right: 20px;}
.nico_test { left: 20px }

.main_wrap .sec01 header .hd_pc .logo_100th{left: 45px;}
}


@media(max-width : 1600px){
.main_wrap .swiper-container .swiper-pagination { display: none;}
.main-button-wrap { right: 30px; }

.hd_mob { padding:80px 30px 0 60px  }
.chatBot { right: 10px;}
.nico_test { left: 10px }

.main_wrap .sec01 header .hd_pc .logo_100th{left: 30px;}
}

@media(max-width : 1300px){
.main_wrap .sec01 header .hd_pc h1 { width: 200px; margin: 0 auto 30px; }
.main_wrap .sec01 header .hd_pc .logo_100th{width: 180px;}
}

/**/
@media(max-width : 1200px){
.inner_1200 { width: 100%; padding: 0 20px; }
.main_wrap .swiper-container .swiper-pagination { display: none;}
.main-button-wrap { display: none; }

.hd_mob	{ padding: 50px 30px 0 60px; }
/*.hd_mob h1 { width: 150px; margin-top: -15px; }*/
.hd_mob h1{margin-top: -15px;}
.hd_mob h1 > img{width: 150px;}
.hd_mob h1 .logo_100th{width: 170px;margin-left: 15px;}


/* sec 04 */
.main_wrap .sec04 .prd_img { padding-top: 50px; }

/* sec 05 */
.main_wrap .sec05 .prd_img { padding-top: 50px; }


/* sec06 */
.main_wrap .sec06 .box_wrap03 .box02 { margin-left: -0.5%; }
.main_wrap .sec04_1 .box_wrap03 .box03 .img_area,
.main_wrap .sec06 .box_wrap03 .box03 .img_area	{ margin: 0 auto; }
.main_wrap .sec04_1 .box_wrap03 .boxes .img_area img,
.main_wrap .sec06 .box_wrap03 .boxes .img_area img { max-width: 100%;  }
.main_wrap .sec04_1 .box_wrap03 .box03 .txt_area,
.main_wrap .sec06 .box_wrap03 .box03 .txt_area { padding: 45px 13% 0 0%; }




/* sec07 */
.main_wrap .sec07 .clock_wrap { max-width: 400px; height: 400px; }
.main_wrap .sec07  .clock_title_wrap > img { width: 70px; }
.main_wrap .sec07 .blet_wrap .clock_txt_wrap .clock_txt { font-size: 18px; }


}


/*ipad pro ~ ipad*/
@media (max-width: 1024px){
.only_pc { display: none; }
.only_mob { display: block; }


/*header*/
.hd_mob { padding: 25px 20px; }


/*sec01*/
.main_wrap .sec01 { display: flex; align-items: center; } 
.main_wrap .scroll_down { left: 20px; bottom: 20px; transform: translate(0); }


/*sec02*/
.main_wrap .sec02 .sec02_txt, .main_wrap .sec02 .sec02_img { float: none; width: 100%; text-align: center; padding: 0 0 20px; } 
.main_wrap .sec02 .sec02_txt .top .title_head { font-size: 20px; }
.main_wrap .sec02 .sec02_txt .top .title_big { font-size: 45px; }
.main_wrap .sec02 .sec02_txt .top .txt_wrap p { font-size: 16px; }
.main_wrap .sec02 .sec02_txt .top .txt_wrap p.txt_wrap_info { font-size: 13px; }
.main_wrap .sec02 .sec02_txt .bottom p { font-size: 45px; display: block; max-width: 480px; margin: 20px auto 0; border-radius: 30px; }
.main_wrap .sec02 .sec02_txt .bottom p img { height: 42px; }
.main_wrap .sec02 .sec02_txt .bottom p .question { font-size: 80px; }
.main_wrap .sec02 .sec02_txt .bottom a { font-size: 20px; margin: -10px 0 0 0; }

.main_wrap .sec02 .sec02_img { width: 200px; margin: 0 auto;}


/*sec03*/
.main_wrap .sec03 .sec03_tit { max-width: 100%; width: 500px; }
.main_wrap .sec03 .sec03_answer a { width: 200px; margin-right: 20px; max-width: calc(50% - 24px); } 

/*sec04*/
.main_wrap .sec04 .prd_txt, .main_wrap .sec04 .prd_img { width: 100%; max-width: 400px; float: none; padding: 0; margin: 0 auto; }
.main_wrap .sec04 .prd_txt .title { font-size: 45px; margin-bottom: 30px; text-align: center; }
.prd_btn_wrap { text-align: center; margin-top: 30px; }
			     

.main_wrap .sec04 .prd_txt .prd_benefits { font-size: 22px; }
.main_wrap .sec04 .prd_txt .prd_benefits img { width: 50px; }

.prd_btn_wrap a { width: calc(50% - 10px); height: 40px; line-height: 40px; font-size: 16px; }


/*sec05*/
.main_wrap .sec05 .prd_txt, .main_wrap .sec05 .prd_img { width: 100%; max-width: 450px; float: none; padding: 0; margin: 0 auto; }

.main_wrap .sec05 .prd_img { max-width: 280px; }

.main_wrap .sec05 .prd_txt .title { font-size: 45px; margin-bottom: 30px; text-align: center; margin-top: -20px; }

.main_wrap .sec05 .prd_txt .prd_benefits { font-size: 22px; }
.main_wrap .sec05 .prd_txt .prd_benefits img { width: 50px; }





/*sec06*/
.main_wrap .sec06 .title { font-size: 45px; margin-bottom: 10px; }
.main_wrap .sec06 .sub_title { width: 45px; height: 45px; line-height: 45px; font-size: 25px; width: 500px; }
    /*border-radius: 20px; */

.main_wrap .sec04_1 .box_wrap03 .boxes{ width: 50%; float: left; padding: 0 0 10px; }
.main_wrap .sec06 .box_wrap03 .boxes { width: 100%; float: none; padding: 0 0 35px; }
.main_wrap .sec04_1 .box_wrap03 .boxes .img_area,
.main_wrap .sec04_1 .box_wrap03 .boxes .txt_area
.main_wrap .sec06 .box_wrap03 .boxes .img_area,
.main_wrap .sec06 .box_wrap03 .boxes .txt_area { float: none; width: 100%; text-align: center; padding: 0; }
.main_wrap .sec04_1 .box_wrap03 .boxes .txt_area{ padding: 20px 0 0; font-size: 14px; }
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area br{display:none;}
.main_wrap .sec06 .box_wrap03 .boxes .txt_area { padding: 20px 0 0; font-size: 17px; }
.main_wrap .sec04_1 .box_wrap03 .box03 .txt_area,
.main_wrap .sec06 .box_wrap03 .box03 .txt_area{ padding: 20px 0 0; }

.main_wrap .sec04_1 .box_wrap03 .boxes .img_area,
.main_wrap .sec06 .box_wrap03 .boxes .img_area { max-width: 200px; margin: 0 auto; }
.main_wrap .sec04_1 .box_wrap03 .box01 .img_area,
.main_wrap .sec04_1 .box_wrap03 .box03 .img_area,
.main_wrap .sec06 .box_wrap03 .box01 .img_area,
.main_wrap .sec06 .box_wrap03 .box03 .img_area {padding-left: 28px; box-sizing: content-box; }
    

/*sec07*/
.main_wrap .sec07 { text-align: center; }
.main_wrap .sec07 .inner_1200 { display: block; }
.main_wrap .sec07 .title { font-size: 45px; margin-bottom: 20px; }





/* sec08 */
.main_wrap .sec08 .inner_1200 { margin-top: 50px; }
.main_wrap .sec08 .title { font-size: 45px; }
.main_wrap .sec08 .box_wrap03 { display: block; width: 100%; max-width: 500px; margin: 0 auto; }
.main_wrap .sec08 .box_wrap03 .boxes { width: 100%; overflow: hidden; display: block; height: 150px; margin-bottom: 20px; border: 2px solid #ddd; border-radius: 10px; }
.main_wrap .sec08 .box_wrap03 .boxes .img_area, .main_wrap .sec08 .box_wrap03 .boxes .txt_area { float: left; height: 150px;  } 
.main_wrap .sec08 .box_wrap03 .boxes .img_area { width: 150px; }
.main_wrap .sec08 .box_wrap03 .boxes .img_area img { max-width: 100%; max-height: 100%; }
.sec08 .box_wrap03 .boxes .txt_area { padding: 20px; text-align: left; display: flex; align-items: center; flex-direction: column; align-items: start; justify-content: center; width: calc(100% - 150px);}

.main_wrap .sec08 .box_wrap03 .boxes:nth-child(1) .img_area { background: #d2ece9;} 
.main_wrap .sec08 .box_wrap03 .boxes:nth-child(2) .img_area { background: #f4e4e7;}
.main_wrap .sec08 .box_wrap03 .boxes:nth-child(3) .img_area { background: #daeaf3; }


.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_tit { font-size: 30px; } 
.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_txt { font-size: 18px; }



/*footer*/
.com_info p:nth-of-type(2) {padding-left:0;}


/*chat bot 챗봇*/
.chatBot { right: 20px; bottom: 20px; }
.chatBot span { top: auto; transform: translate(0); bottom: calc(100% + 20px); right: 0; }
.chatBot span:after { /*처리*/ }

.nico_test { left: 20px; bottom: 20px; }


.main_wrap .sec07_box  { padding: 10px 0; position:relative; }
.main_wrap .sec07_box .text_wrap .sec07_box_tit { margin-bottom: 5px; font-size: 18px; }
.main_wrap .sec07_box img { width: 110px; height: 110px; }
.main_wrap .sec07_box .text_wrap { width: calc( 100% - 110px); height: auto;}
.main_wrap .sec07_box .text_wrap { padding: 5px 10px; }
.main_wrap .sec07_box .text_wrap .sec07_box_txt  { height: 38px; text-align:left; font-size:16px; }
.sec07 .btn_phar { width: 120px; height: 30px; line-height: 30px; font-size: 14px; border-radius: 15px; margin:0; position:absolute; bottom:10px;}



}


/* ipad 이하 사이즈*/
@media (max-width: 767px){
	.main_wrap { letter-spacing: 0; }
	/*header*/
	.hd_mob h1 > img { width: 100px;}
	.hd_mob .nav_open { width: 24px; height: 18px; }
	.hd_mob h1 .logo_100th{width: 115px;margin-left: 10px;}
	.hd_mob h1{margin-top: -10px;}

	.hd_mob .nav_open.on { height: 24px; }
	/*nav*/
	.hd_mob .nav_mob{ width: 100%; display: flex; align-items:center; text-align: center; justify-content: center; flex-direction: column; }
	.hd_mob .nav_mob a { font-size: 20px; margin-bottom: 25px; }

	/*sec01*/
	.main_wrap .sec01 .inner_1200 { padding: 0 20px; }
	/*.main_wrap .sec01 header .hd_pc > img { width: 190px; }*/
	.main_wrap .sec01 header .hd_pc nav a { font-size: 12px; margin-right: 15px; letter-spacing:-1px;}

	.main_wrap .sec01 header .hd_pc h1 { width: 150px; margin: 50px auto 30px; }

	.main_wrap .sec01 header .hd_pc .logo_100th{width: 115px;left: 20px;}

	/*sec02*/
	.main_wrap .sec02 { padding-top: 150px; word-break: keep-all; }
	.main_wrap .sec02 .sec02_txt, .main_wrap .sec02 .sec02_img { float: none; width: 100%; text-align: center; } 
	.main_wrap .sec02 .sec02_txt .top .title_head { font-size: 18px; }
	.main_wrap .sec02 .sec02_txt .top .title_big { font-size: 25px; }

	.main_wrap .sec02 .sec02_txt .top .rel_box .hidden_box { max-width: 95%; left: 4px; bottom: -5px; }
	.main_wrap .sec02 .sec02_txt .top .txt_wrap p { font-size: 14px; }
	.main_wrap .sec02 .sec02_txt .top .txt_wrap p.txt_wrap_info { font-size: 11px; padding-top: 0; }
	.main_wrap .sec02 .sec02_txt .bottom p { font-size: 25px; letter-spacing: -3px; max-width: 300px; padding: 15px 20px; border-width: 4px; border-radius: 25px; }
	.main_wrap .sec02 .sec02_txt .bottom p .question { font-size: 40px; }
	.main_wrap .sec02 .sec02_txt .bottom a { font-size: 16px; padding: 10px 30px; }
	.main_wrap .sec02 .sec02_txt .bottom a img { margin-left: 10px;  }

	.main_wrap .sec02 .sec02_img { width: 100px; margin-bottom: 20px; display:none;}
	



	/*sec03*/
	.main_wrap .sec03 .sec_title { font-size: 25px; line-height: 1.3; margin-bottom: 20px; }
	.main_wrap .sec03 .sec_title img { width: 120px; }
	.sec03_ex_wrap { padding: 0; }
	.sec03_txt .sec03_ex_tit { font-size: 15px; }
	.sec03_txt .sec03_ex_txt { font-size: 12px; }



	/*sec04*/
	.main_wrap .sec04 .prd_txt .title { font-size: 27px; margin: -20px 0 20px; }

	.main_wrap .sec04 .prd_txt .prd_benefits { font-size: 18px; }
	.main_wrap .sec04 .prd_txt .prd_benefits li { margin-bottom: 10px; }
	.main_wrap .sec04 .prd_txt .prd_benefits img { width: 50px; margin-right: 5px; }

	.prd_btn_wrap { text-align: center; margin-top: 30px; }
	.prd_btn_wrap a { width: calc(50% - 10px); font-size: 12px; }		     




	/*sec05*/
	.main_wrap .sec05 .prd_img { max-width: 60%; }
	.main_wrap .sec05 .prd_txt .title { font-size: 27px; margin: -20px 0 20px; }

	.main_wrap .sec05 .prd_txt .prd_benefits { font-size: 18px; }
	.main_wrap .sec05 .prd_txt .prd_benefits li { margin-bottom: 10px; }
	.main_wrap .sec05 .prd_txt .prd_benefits img { width: 50px; margin-right: 5px; }





	/*sec06*/
    .main_wrap .sec04_1 .title_wr{ margin-bottom: 15px; }
	.main_wrap .sec06 .title_wr { margin-bottom: 30px; }
    .main_wrap .sec04_1 .title,
	.main_wrap .sec06 .title { font-size: 25px; margin-bottom: 15px; }
    .main_wrap .sec04_1 .sub_title,
	.main_wrap .sec06 .sub_title { font-size: 16px; width: 100%; height: 40px; line-height: 40px; padding:0; }
	 

	.main_wrap .sec06 .box_wrap03 .boxes { padding: 0 0 20px; }
    .main_wrap .sec04_1 .box_wrap03 .boxes .img_area,
	.main_wrap .sec06 .box_wrap03 .boxes .img_area { width: 150px; }
	.main_wrap .sec06 .box_wrap03 .boxes .txt_area { padding-top: 15px; font-size: 16px; }



	/*sec07*/
	.main_wrap .sec07 .title { font-size: 25px; margin-bottom: 30px;letter-spacing:-1.5px; }
	.main_wrap .sec07_box  { padding: 10px 0; position:relative; }
	.main_wrap .sec07_box img { width: 100px; height: 100px; }
	.main_wrap .sec07_box .text_wrap { height: 100px; width: calc(100% - 100px); /* padding: 10px 20px; */ padding-right: 0;  }
/* 	.main_wrap .sec07_box .text_wrap .sec07_box_tit { font-size: 20px; }
	 */	.main_wrap .sec07_box .text_wrap .sec07_box_txt { font-size: 13px; }



	 /* sec08 */
	.main_wrap .sec08 .title { font-size: 25px; margin-bottom: 30px; word-break: keep-all; }

	.main_wrap .sec08 .box_wrap03 .boxes { height: 120px; }
	.main_wrap .sec08 .box_wrap03 .boxes .img_area { height: 120px; width: 120px; }

	.main_wrap .sec08 .box_wrap03 .boxes .txt_area { padding: 15px; width: calc(100% - 120px); height: 120px; }
	.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_tit { font-size: 18px; }
	.main_wrap .sec08 .box_wrap03 .boxes .txt_area .txt_txt { font-size: 14px; word-break: keep-all; }

	

	/*footer*/
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.main_ft { width: 100%; height: 240px; font-size: 15px; }
	.main_ft .left { float: none; width: 100%; }
	.main_ft .left img { width: 140px; }

	.main_ft .right { float: none; width: 100%; }
	.main_ft .right .com_info { margin: 25px 0 15px; line-height: 1.7; }
	.com_info p { padding: 0 20px; margin-bottom:0;}
	.com_info p:first-child { padding: 0; }
	.com_info p:nth-of-type(2) { padding-left: 0; }
	.main_ft .copy { font-size: 11px; }




	/*스크롤*/
	.main_wrap .scroll_down { width: 50px; height: 50px; }
	
	/* 니코틴 의존도 검사하기 */
	.nico_test { display: flex;  }
    /*flex-direction: column;*/
	.nico_test .nico_txt { margin-right: 0; margin-bottom: 0px; margin-left: 10px; max-width: 100%; min-width: 1px; order: 1;}
	.nico_test span:after { top: calc(50% - 5px); left:-10px; transform: translate(0) rotate(90deg); border-top: 5px solid #cf2447; border-left: 5px solid transparent; border-right: 5px solid transparent;  }
	.nico_test > a	{ order: 1; width:50px;}
	.nico_test img { width: 50px; height: 50px; }
    .nico_test .chat_text{text-align:center;}
	
	/*니코틴 의존도 애니메이션*/
	@keyframes nico {
		0% { width: 0; overflow:hidden; }
		5%{overflow: visible;}
		100% { width: 170px; }
	}

	
	/*챗봇*/
	.chatBot { display: flex; flex-direction: column; align-items: flex-end;  }
	.chatBot .chat_txt { margin-right: 0; margin-bottom: 15px; margin-left: 20px; max-width: 100%; min-width: 1px;}
	.chatBot span:after { top: 100%; right:25px; transform: translate(0); border-top: 5px solid #48bed2; border-left: 5px solid transparent; border-right: 5px solid transparent;  }
	.chatBot img { width: 50px; height: 50px; }

	
	/*챗봇 애니메이션*/
	@keyframes chat {
		0% { width: 0; overflow:hidden; }
		98%{overflow: hidden;}
		100% { width: 296px; overflow:visible; }
	}
}



/* 모바일 환경 */
@media (max-width: 480px) { 
	.hd_mob .nav_mob { max-width: 100%; }

	.main_wrap .sec01 header .hd_pc h1{width: 130px;}
	.main_wrap .sec01 header .hd_pc .logo_100th{width: 75px;}

	 /*아이폰 네비 겹치지 않게*/
	/* .main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.sec01 .inner_1200 { padding-top: 0; }
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.sec02 .inner_1200 { padding-top: 90px; }
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.sec03 .inner_1200 { padding-top: 90px; }
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.sec04 .inner_1200 { padding-top: 90px; }
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.sec05 .inner_1200 { padding-top: 90px; }
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.sec06 .inner_1200 { padding-top: 180px; }
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.sec07 .inner_1200 { padding-top: 90px; } */
	.main_wrap .swiper-container.wrap_slider > .swiper-wrapper > .swiper-slide.main_ft { padding-top: 0; padding-bottom: 0; }

	.main_wrap .sec06_txt_wr .btn { height: 40px; line-height: 40px; font-size: 18px; border-radius: 20px; padding: 0 25px; margin-top: 10px;}
	.main_wrap .sec06_txt_wr .btn img { margin-top: 5px; }


	/*sec02*/

	.main_wrap .sec02 .inner_1200 {}

	  
}



/*애니메이션 모음(pc)*/
/*버튼 다운*/
@keyframes scrollDown { 
	0% { bottom :80px; }
	100% { bottom: 50px;  }
}




/*애니메이션 모음(mobile)*/
/*버튼 다운*/
@media(max-width: 1024px){
	@keyframes scrollDown { 
		0% { bottom : 20px; }
		100% { bottom: 30px;  }
	}
}






.timeline{display:none;}

/*높이가 너무 작은 PC일 경우*/
@media (max-height: 850px) and (min-width: 1025px){
    .hghRsz01{transform: scale(0.7);transform-origin: center top;height: 680px;}
    .hghRsz02{transform: scale(0.7);transform-origin: center center;height: 680px;}
}


@media (max-width: 1024px){
    
    
}


.main_wrap .sec01 .sec01_pc .sec01_tit01{transform: scale(0.9);transform-origin: left center;}
.main_wrap .sec01 .sec01_pc .sec01_tit02{transform: scale(0.9);transform-origin: right center;}

.timeline li{opacity:0.3;transition:all 0.5s;}

/*아이패드전용*/
@media (min-width: 768px) and (max-width: 768px){
    .main_wrap .sec01 .sec01_pc .sec01_tit_wrap{padding:0 40px;}
    .main_wrap .sec01 .sec01_pc .sec01_prds{bottom: auto;position: static;transform: none;width: 90%;margin: 30px auto 0 auto;display: block;}
    
    
    .main_wrap .scroll_down{display:none;}
    .clock_wrap{display:none;}
    .main_wrap .sec08 .inner_1200{margin-top:20px;}
    .timeline{display:block;position:relative;width: 570px;margin:50px auto 0 auto;}
    .timeline::before{content:" ";width:1px;height:calc(100% - 90px);background-color:#eeeeee;position:absolute;top:23px;left:21px;}
    .timeline li{margin-bottom:45px;width:100%;display:inline-block;position:relative;}
    .timeline li::before{content:" ";width:45px;height:1px;background-color:#f1bdc7;position:absolute;top:21px;left:15px;}
    .timeline li strong{display:block;width:150px;border-radius:45px;font-weight:bold;color:#fff;font-size:24px;text-align:center;line-height:45px;margin-left:60px;background-color:#cf2447;float:left;}
    /*f1bdc7*/
    .timeline li strong::before{content:" ";width:45px;height:45px;background:url("/images/main/img_mob_bullet.png") no-repeat;background-size:100% auto;position:absolute;top:0;left:0;transform: translateX(-1px) translateY(-1px);}
    .timeline li p{font-size:22px;color:#222425;font-weight:bold;padding-left:30px;display:block;width:calc(100% - 210px);float:right;letter-spacing: -1.5px;text-align: left;word-break: keep-all;line-height: 45px;}
    
    .main_wrap .sec02 .sec02_txt .bottom p{padding-bottom:40px;}
    .main_wrap .sec02 .sec02_txt .bottom a{transform: translateY(-20px);}
    .main_wrap .sec04_1 .box_wrap03 .boxes{margin-bottom:20px;}
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area{transform: translateX(10px);}
}


/*아이패드프로전용*/
@media (min-width: 1024px) and (max-width: 1024px){
    .main_wrap .sec01 .sec01_pc .sec01_tit_wrap{padding:0 40px;margin-top:50px;}
    .main_wrap .sec01 .sec01_pc .sec01_tit01{transform: scale(1.0);transform-origin: left center;}
    .main_wrap .sec01 .sec01_pc .sec01_tit02{transform: scale(1.0);transform-origin: right center;}
    .main_wrap .sec01 .sec01_pc .sec01_prds{bottom: auto;position: static;transform: none;width: 100%;margin: 50px auto 0 auto;display: block;}
    
    .clock_wrap{transform: scale(0.9);margin-top:40px;}
    .main_wrap .sec02 .sec02_txt .bottom p{padding-bottom:40px;}
    .main_wrap .sec02 .sec02_txt .bottom a{transform: translateY(-20px);}
    .main_wrap .sec04_1 .box_wrap03 .boxes{margin-bottom:20px;}
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area{transform: translateX(10px);}
}


/*모바일전용*/
@media (max-width: 767px){
    .main_wrap .swiper-container.wrap_slider{height:calc(var(--vh, 1vh) * 100);}
    
    
    
    
    .main_wrap .sec08 .inner_1200,
    .main_wrap .sec07 .inner_1200,
    .main_wrap .sec06 .inner_1200{position: absolute;top: 50%;transform: translateY(calc(-50% - 25px));padding-top:0;margin-top:0;}
    .main_wrap .sec05 .inner_1200,
    .main_wrap .sec04_1 .inner_1200,
    .main_wrap .sec04 .inner_1200,
    .main_wrap .sec03 .inner_1200{position: absolute;top: 50%;transform: translateY(calc(-50% - 35px));padding-top:0;margin-top:0;}
    .main_wrap .sec02 .inner_1200{position: absolute;top: 50%;transform: translateY(calc(-50% - 20px));padding-top:0;margin-top:0;}
    
    .iphoneSpace{transform: translateY(calc(-50% - 50px)) !important;}
    
    .main_wrap .sec04 .prd_img img{width:90%;display:block;margin-left:auto;margin-right:auto;}
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area{font-size:12px;}
    
    
    
    
    .clock_wrap{display:none;}
    
    /*.nico_txt,*/
    .scroll_down,
    .chat_txt{display:none !important;}
    /* .main_wrap .sec01 .sec01_pc{display:none;} */
    .main_wrap .sec01 .sec01_mob{display:none;}
    .sec01_mob img{margin-left:-20px;width:100vw;max-width:100vw;}
    .main_wrap .sec02{display:block;position:relative;}
    .main_wrap .sec02 .sec02_img{position:absolute;bottom:20px;left:50%;transform: translateX(-50%);}
    .sec02_txt .top *{text-align:left;}
    .main_wrap .sec02 .sec02_txt .top .title_head{font-size:20px;}
    .main_wrap .sec02 .sec02_txt .top .title_big{letter-spacing:-3px;}
    .main_wrap .sec02 .sec02_txt .top .rel_box{padding:0 15px 0 10px;}
    .main_wrap .sec02 .sec02_txt .top .rel_box .hidden_box{width:50px;}
    .main_wrap .sec02 .sec02_txt .top .txt_wrap p:first-child br{display:none;}
    .main_wrap .sec02 .sec02_txt .bottom p{font-size:30px;letter-spacing:-3px;padding-bottom:30px;}
    .main_wrap .sec02 .sec02_txt .bottom p img{width:15px;height:auto;}
    .main_wrap .sec02 .sec02_txt .bottom a{font-size: 20px;padding: 15px 30px;letter-spacing: -2px;transform: translateY(-20px);}
    
    .main_wrap .sec05 .inner_1200{padding-top:10px;}
    .main_wrap .sec05 .prd_txt .title,
    .main_wrap .sec04 .prd_txt .title{font-size:20px;letter-spacing:-1px;}
    .main_wrap .sec05 .prd_txt .title{margin-left: -20px;width: calc(100vw);}
    .main_wrap .sec05 .prd_txt .title br,
    .main_wrap .sec04 .prd_txt .title br{display:none;}
    .main_wrap .sec05 .prd_txt .prd_benefits,
    .main_wrap .sec04 .prd_txt .prd_benefits{margin-bottom:-15px;}
    .main_wrap .sec05 .prd_txt .prd_benefits img,
    .main_wrap .sec04 .prd_txt .prd_benefits img{width:35px;}
    .main_wrap .sec05 .prd_txt .prd_benefits li,
    .main_wrap .sec04 .prd_txt .prd_benefits li{letter-spacing:-1px;}
    
    .main_wrap .sec04_1 .box_wrap03 .boxes,
    .main_wrap .sec06 .box_wrap03 .boxes{overflow:hidden;}
    .main_wrap .sec04_1 .box_wrap03 .boxes .img_area{float:none;padding-left:0;}
    .main_wrap .sec06 .box_wrap03 .boxes .img_area{float:left;padding-left:0;}
    /*
    .main_wrap .sec04_1 .box_wrap03 .box01 .img_area{transform: translateX(10px);}
    .main_wrap .sec04_1 .box_wrap03 .box01 .txt_area{transform: translateX(20px);}
    .main_wrap .sec04_1 .box_wrap03 .box03 .txt_area{transform: translateX(15px);}
    */
    
    .main_wrap .sec04_1 .box_wrap03 .box01 .txt_area{}
    
    .main_wrap .sec06 .box_wrap03 .box02{transform: translateX(-15px);}
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area,
    .main_wrap .sec06 .box_wrap03 .boxes .txt_area{text-align:left;}
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area{float: right;width: 100%;}
    .main_wrap .sec06 .box_wrap03 .boxes .txt_area{float: right;width: calc(100% - 150px);}
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area p,
    .main_wrap .sec06 .box_wrap03 .boxes .txt_area p{padding-left: 10px;}
    .main_wrap .sec06 .box_wrap03 .box02 .txt_area{padding-left:15px;}
    
    
    .main_wrap .sec08 .title{letter-spacing: -2px;}
    
    /*
    .main_wrap .sec06 .box_wrap03 .box02 .img_area{margin-right:15px;}
    */
    
    .timeline{display:block;position:relative;}
    .timeline::before{content:" ";width:1px;height:calc(100% - 60px);background-color:#eeeeee;position:absolute;top:15px;left:14px;}
    .timeline li{margin-bottom:30px;width:100%;display:inline-block;position:relative;}
    .timeline li::before{content:" ";width:30px;height:1px;background-color:#f1bdc7;position:absolute;top:14px;left:10px;}
    .timeline li strong{display:block;width:100px;border-radius:30px;font-weight:bold;color:#fff;font-size:16px;text-align:center;line-height:30px;margin-left:40px;background-color:#cf2447;float:left;}
    /*f1bdc7*/
    .timeline li strong::before{content:" ";width:45px;height:45px;background:url("/images/main/img_mob_bullet.png") no-repeat;background-size:100% auto;position:absolute;top:0;left:0;transform: translateX(-8px) translateY(-8px);}
    .timeline li p{font-size:15px;color:#222425;font-weight:bold;padding-left:20px;display:block;width:calc(100% - 140px);float:right;letter-spacing: -1.5px;text-align: left;word-break: keep-all;line-height: 30px;}
    
    
}


/*PC만적용*/
@media (min-width: 1025px){
    .main_wrap .sec04_1 .box_wrap03 .box01{width:22%;}
    .main_wrap .sec04_1 .box_wrap03 .box02{width:26%;}
    .main_wrap .sec04_1 .box_wrap03 .box03{width:26%;}
    .main_wrap .sec04_1 .box_wrap03 .box04{width:26%;transform:translateX(15px);}
}

    .sec01_mob{margin-top:-20px;}

/*아이폰8 해상도 시리즈에서 height가 부족해 콘텐츠가 짤리는 현상 방지*/
@media (max-height: 600px){
    .main_wrap .sec01 header .hd_pc{margin-top:-30px;}
    .sec01_tit_wrap{background:url("../images/main/img_mob_sec01_02.png") no-repeat;background-size:100% auto;width:100vw;margin-left:-20px;height:400px;margin-top:'-30px;'}
    .sec01_tit_wrap img{display:none;}
    
    .main_wrap .sec02 .inner_1200.iphoneSpace{transform: translateY(calc(-50% - 35px)) !important;}
    
    
    .main_wrap .sec04 .prd_img img{width:80%;}
    .main_wrap .sec04 .prd_txt .prd_benefits{transform: scale(0.85);transform-origin: top center;}
    .main_wrap .sec04 .prd_txt .prd_btn_wrap{margin-top:10px;width: 90%;margin-left: auto;margin-right: auto;}
        
    
    .main_wrap .sec04_1 .box_wrap03{margin-left:-10px;}
    .main_wrap .sec04_1 .box_wrap03 .boxes .img_area img{width:70%;}
    .main_wrap .sec04_1 .box_wrap03 .boxes .txt_area p{margin-left:10px;}
    
    .main_wrap .sec05 .prd_txt .title, .main_wrap .sec04 .prd_txt .title{font-size:14px;}

    .main_wrap .sec05 .prd_img img{width:80%;}
    .main_wrap .sec05 .prd_txt .prd_benefits{transform: scale(0.85);transform-origin: top center;}
    .main_wrap .sec05 .prd_txt .prd_btn_wrap{margin-top:10px;width: 90%;margin-left: auto;margin-right: auto;}
    
    .main_wrap .sec06 .box_wrap03{transform: scale(0.85);transform-origin: top center;}
    
    .sec06 .iphoneSpace{transform: translateY(calc(-50% - 20px)) !important;}
    
    .main_wrap .sec07 .inner_1200.iphoneSpace{transform:translateY(calc(-50% - 10px)) scale(0.9) !important;transform-origin:top center;}
    
    .main_wrap .sec08 .inner_1200.iphoneSpace{transform:translateY(calc(-50% - 10px)) scale(0.85) !important;transform-origin:top center;}
}