@charset "utf-8";


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap');
@font-face {
font-family: 'Stardom-Regular';
font-weight:400;
src: url("../font/Stardom-Regular.woff") format("woff");
}   
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   src: url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
   unicode-range:U+AC00-U+D7A3;
}





html {position: relative; height: 100%; min-height: 100%; margin: 0; -webkit-text-size-adjust:none;}
body {position: relative; width: 100%; height: auto; min-height: 100%; font-family:'Open Sans', 'Noto Sans KR', 'Apple SD Gothic Neo', 'sans-serif'; overflow-y: auto; overflow-x: hidden; letter-spacing: -0.5px;}
*, *::before, *::after {padding:0; margin:0; box-sizing: border-box;}
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;font-family:'Open Sans', 'Noto Sans KR', 'Apple SD Gothic Neo', 'sans-serif';}
input,button,textarea,select{font-family:'Open Sans', 'Noto Sans KR', 'Apple SD Gothic Neo', 'sans-serif';}
ul {list-style-type: none; padding-inline-start: 0;}
a {text-decoration: none;}
table{padding:0; border:0; border-spacing:0px; border-collapse:collapse;}
th, td{padding:0;}
button {border: none; background:none; cursor: pointer;}
input {border: none;}
input:focus, select:focus, option:focus, textarea:focus, button:focus{outline: none;}
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
textarea:focus {outline:none;}
legend.hidden {display: none;}



input {font-size: 20px; border-bottom: 1px solid #bcbcbc; width: 100%; height: 54px;}
input::placeholder {font-size: 20px; font-weight: 300; color:#888;}
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label span {display: inline-block; width: 20px; height: 20px; margin: 0px 10px 0 0; vertical-align: sub; background: url('../img/checkbox.svg') left top no-repeat; cursor: pointer; background-size: cover;}
input[type="checkbox"]:checked + label span { background:url('../img/checkbox.svg')  -21px top no-repeat; background-size: cover;}
input[type="checkbox"] + label p {cursor: pointer; display: inline-block; font-size: 16px; font-weight: 500; color:#333; vertical-align: revert;}
input[type="checkbox"]:checked + label p {color:#000; font-weight: 500;}
input[type="radio"]:checked {accent-color: #6f676f;}

textarea {border: none; border-bottom: 1px solid #bcbcbc; width: 100%; font-size: 16px; height: 160px; resize: none;}
select {border: none; border-bottom: 1px solid #bcbcbc; font-size: 20px; font-weight: 400; height: 54px; color:#888; background: url('../img/select_arrow.png') transparent no-repeat 98% 50% / 13px 7px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none;}


table {border-top: 2px solid #000; width: 100%;}
table th {padding: 17px 10px; background-color: #feebe4; border-bottom: 1px solid #d5d5d5; border-right: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; vertical-align: middle;}
table th:last-child {border-right: 0;}
table th.f24 {font-weight: 600;}
table td {background-color: #fff; border-right: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; padding: 8px 10px; text-align: center; vertical-align: middle;}
table td:last-child {border-right: 0;}
table td .f20 {color:#666; font-weight: 500;}


.container {overflow: hidden; padding-top: 110px; padding-bottom: 160px;}
.section {position: relative; margin-bottom: 240px;}

.sub_contents_wrapper {width: 100%; max-width: 1520px; padding: 0 20px; margin: 0 auto; position: relative;}
.sub_section {margin: 100px 0 200px;}
.pc {display: inline-block;}
.m {display: none;}
.max_w {width: 100%; max-width: 1355px; padding: 0 16px; margin: 0 auto; position: relative;}
.sub_max_w {width: 100%; max-width: 1732px; padding: 0 16px; margin: 0 auto; position: relative;}
.stardom {font-family:'Stardom', 'sans-serif';}
.montserrat {font-family:'Montserrat', 'sans-serif';}

.image100 img {width: 100%;}
.more_btn {border-radius: 50px; display: flex; justify-content: center; align-items: center; padding: 13px 10px; width: 174px; height: 55px; text-align: center;}
.more_btn .f18 {display: flex; justify-content: center; align-items: center; letter-spacing: -0.5px;}
.more_btn.color_btn {background-color: #333;}
.more_btn.color_btn .f18 {color:#fff;}
.more_btn.color_btn .f18 span.plus {background: #fff;}
.more_btn.color_btn .f18 span.plus::after {background: #fff;}
.more_btn.line_btn {border: 1px solid #333;}
.more_btn .f18 span.plus {position:relative; background: #383838; height: 12px; width: 2px; margin-left: 16px;}
.more_btn span.plus::after {content: ""; background: #383838; position: absolute; height: 2px; left: -5px; top: 5px; width: 12px;}

.more_btn.color_btn:hover {background-color: #ea5413;}
.more_btn.line_btn:hover {border: 1px solid #ea5413;}
.more_btn.line_btn:hover .f18 {color:#ea5413;}
.more_btn.line_btn:hover .f18 span.plus {background: #ea5413;}
.more_btn.line_btn:hover span.plus::after {background: #ea5413;}

.search_bar {text-align: right; width: 100%;}
.search_bar form {position: relative; display: inline-block; width: 100%;}
.search_bar input {font-size: 18px; background-color: #f5f5f5; padding: 16px 30px; border-radius: 50px; position: relative; width: 100%; max-width: 470px; border: none;}
.search_bar button {width: 19px; height: 20px; background: url('../img/search_btn_x3.png') no-repeat center / cover;  position: absolute; right: 30px;  top: 50%; transform: translateY(-50%);}

.list_box .play_btn {width: 139px; height: 139px; background: url('../img/video_play_btn_x3.png') no-repeat center / cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; transition: all 0.3s;}
.list_box:hover .play_btn {top: 45%; transition: all 0.3s;}
.video_wrap {position: relative;}
.video_wrap .image100 {border-radius: 30px; overflow: hidden; display: flex;}
.video_wrap .play_btn2 {width: 222px; height: 222px; background: url('../img/video_play_btn2_x3.png') no-repeat center / cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}


/** font **/
.f132, .f70, .f64, .f55, .f50, .f48, .f46, .f45, .f36, .f34, .f30, .f28, .f27, .f26, .f24, .f23, .f22, .f20, .f18, .f17, .f16 .f15, .f14, .f13 {color:#222;}
.f132 {font-size: 132px; font-weight: 500; line-height: 90px; letter-spacing: -3px; word-break: keep-all;}
.f76 {font-size: 76px; font-weight: 500; line-height: 96px; letter-spacing: -3px; word-break: keep-all;}
.f70 {font-size: 70px; font-weight: 500; line-height: 90px; letter-spacing: -3px; word-break: keep-all;}
.f64 {font-size: 64px; font-weight: 700; line-height: 74px; letter-spacing: -3px; word-break: keep-all;}
.f55 {font-size: 55px; font-weight: 500; line-height: 75px; letter-spacing: -3px; word-break: keep-all;}
.f50 {font-size: 50px; font-weight: 700; line-height: 60px; letter-spacing: -3px; word-break: keep-all;}
.f48 {font-size: 48px; font-weight: 700; line-height: 58px; letter-spacing: -2px; word-break: keep-all;}
.f46 {font-size: 46px; font-weight: 700; line-height: 56px; letter-spacing: -2px; word-break: keep-all;}
.f45 {font-size: 45px; font-weight: 700; line-height: 55px; letter-spacing: -2px; word-break: keep-all;}
.f36 {font-size: 36px; font-weight: 700; line-height: 46px;}
.f34 {font-size: 34px; font-weight: 400; line-height: 44px;}
.f30 {font-size: 30px; font-weight: 600; line-height: 40px;}
.f28 {font-size: 28px; font-weight: 600; line-height: 38px;}
.f27 {font-size: 27px; font-weight: 500; line-height: 37px;}
.f26 {font-size: 26px; font-weight: 500; line-height: 36px;}
.f24 {font-size: 24px; font-weight: 500; line-height: 34px;}
.f23 {font-size: 23px; font-weight: 400; line-height: 33px;}
.f22 {font-size: 22px; font-weight: 400; line-height: 32px;}
.f20 {font-size: 20px; font-weight: 400; line-height: 34px;}
.f18 {font-size: 18px; font-weight: 500; line-height: 28px;}
.f17 {font-size: 17px; font-weight: 400; line-height: 27px;}
.f16 {font-size: 16px; font-weight: 400; line-height: 26px;}
.f15 {font-size: 15px; font-weight: 400; line-height: 25px;}
.f14 {font-size: 14px; font-weight: 400; line-height: 22px;}
.f13 {font-size: 13px; font-weight: 400; line-height: 21px;}






/** header **/
#header {width: 100%; box-shadow: 0px 3px 17px rgb(0 0 0 / 2.5%); position: absolute; z-index: 10;}
.header_con {width:100%; z-index: 5; display: flex; justify-content: space-between; align-items: center;border-bottom: 1px solid #e2e0dd; padding: 0 107px; height: 110px;}
.header_con .max_w {display: flex; justify-content:space-between; align-items: center;}
.header_con .logo {flex-shrink: 0;}
.header_con .logo a {display: inline-block;}
.header_con .logo a img {width: 100%; max-width: 137px;}
.header_con .navigator .header-menu {display: inline-block; vertical-align: middle;}
.header_con .navigator .header-menu li {display: inline-block; padding: 0 30px; vertical-align: top; cursor: pointer;}
.header_con .navigator .header-menu li a {font-family:'Montserrat', 'sans-serif';  font-size: 18px; font-weight: 700; color:#333; transform: skew(-0.01deg);  transition: all 0.8s ease;}
.header_con .navigator .header-menu li.active a {border-bottom: 3px solid #ea5413;}
.header_con .navigator .header-menu li.on {overflow: hidden; position: relative;}
.header_con .navigator .header-menu li:hover a {color:#ea5413;}
.header_con .navigator .header-menu li.on .sub_menu {display: none; background-color: #fff; padding:19px 24px; border-radius: 4px; width: 100%; position: fixed; left: 0; top: 110px; box-shadow: 0px 10px 15px rgb(0 0 0 / 5%); text-align: center; z-index: 10;}
.header_con .navigator .header-menu li.on .sub_menu li {display: inline-block; margin: 12px 25px; padding: 0; text-align: left;}
.header_con .navigator .header-menu li.on .sub_menu li::after {content: ''; display: inline-block; width: 2px; height: 2px; background-color: #333; margin-left: 50px; vertical-align: middle;}
.header_con .navigator .header-menu li.on .sub_menu li:last-child::after {display: none;}
.header_con .navigator .header-menu li.on .sub_menu li a {font-family:'Montserrat', 'sans-serif'; font-size: 18px; font-weight: 500; color:#444;}
.header_con .navigator .header-menu li.on .sub_menu li a::after {display: none;}
.header_con .navigator .header-menu li.on .sub_menu li a:hover {color:#ea5413; transition: all 0.3s ease;}
.header_con .right_menu {display: flex; align-items: center;}
.header_con .right_menu .login_btn {font-family:'Montserrat', 'sans-serif'; font-size: 16px; background-color: #ea5413; color:#fff; font-weight: 500; border-radius: 50px; padding: 10px 28px; cursor: pointer;}
.header_con .right_menu .login_btn.logn_2{margin-right:10px;}
.header_con .right_menu .log{
	display: flex;
    align-items: center;
}

.header .all_menu_con {background-color: #fff; padding: 40px 0 55px; box-shadow: 0px 15px 20px rgb(0 0 0 / 8%); }
.header .all_menu_con .min_w {display: flex; justify-content: space-between;}
.header .all_menu_con .box {flex-basis: 25%; max-width: 220px;}
.header .all_menu_con .box .f24 {margin-bottom: 15px; font-weight: 700;}
.header .all_menu_con .box .sub_menu li {padding: 5px 0;}
.header .all_menu_con .box .sub_menu li a {font-size: 16px; font-weight: 500; color:#222;}
.header .all_menu_con .box .sub_menu li a:hover, .header .all_menu_con .box .sub_menu li .depth li a:hover {color:#ea5413; border-bottom: 1px solid #ea5413;}
.header .all_menu_con .box .sub_menu li .depth {border-top: 1px solid #e6e6e6; margin: 10px 0 20px; padding-top: 10px;}
.header .all_menu_con .box .sub_menu li .depth li {padding: 2px 0;}
.header .all_menu_con .box .sub_menu li .depth li a {font-size: 15px; font-weight: 400; color:#666;}

.header .m_menu_btn {display: inline-block; cursor: pointer; display: none;}
.header .m_menu_btn .menu-trigger {position: relative; width: 16px; height: 15px;}
.header .m_menu_btn .menu-trigger span {position: absolute; right: 0; width: 100%; height: 2px; background-color: #172244; border-radius: 100px;}
.header .m_menu_btn .menu-trigger span:nth-child(1) {top: 0;}
.header .m_menu_btn .menu-trigger span:nth-child(2) {top: 6px; width: 80%;}
.header .m_menu_btn .menu-trigger span:nth-child(3) {bottom: 0;}

.header .modal {display: none; position: fixed; width: 100%; height: 100vh; top: 0; right: 0; bottom: 0; z-index: 999; background:#ea5413;}
.header .modal .header_close_btn {display: inline-block; width: 24px; height: 24px;  position: absolute;  right: 20px;  top: 24px; cursor: pointer; z-index: 1;}
.header .modal .header_close_btn span { display: inline-block; background: #fff; height: 24px;  position: relative; width: 1px; transform: rotate( 135deg); left: 10px;}
.header .modal .header_close_btn span:after {content: ""; background: #fff; height: 1px; position: absolute; top: 12px;  left: -11px; width: 24px;}
.header .modal .container {height: 100vh; padding-top: 0;}
.header .modal ul#myMenu {position: relative; top: 50%; transform: translateY(-52%); text-align: center;}
.header .modal li {white-space: nowrap;}
.header .modal li.category {margin-bottom: 20px; cursor: pointer; line-height: 30px;}
.header .modal li.category a.cate_txt {font-family:'Montserrat', 'sans-serif';  font-size: 24px; font-weight: 600; color: #fff;} 
.header .modal ul.sub_menu {margin-top: 6px; display: none;}
.header .modal ul.sub_menu li {padding: 3px 0;}
.header .modal ul.sub_menu li a {font-family:'Montserrat', 'sans-serif';  font-size: 16px; font-weight: 500; color:#ffe4d9; line-height: 28px; display: inline-block; position: relative;}
.header .modal li a span {display: inline-block;  z-index: 1;  height: 3px; width: 0%;  background-color: #fff; position: absolute; bottom: 1px; left: 0;}
.header .modal li a:hover {color:#fff; transition: all 0.8s;} 
.header .modal li a:hover span { width: 100%; transition: all 0.8s;} 
.header .modal li a .circle {display: inline-block;  width: 12px; height: 12px; background-color: #ec6617; border-radius: 50%; position: absolute; right: -30px; top: 0; opacity: 0; }
.header .modal li a:hover .circle {opacity: 1; transition: all 0.8s;}

.header .login_modal {display: inline-block; position: absolute; width: 100%; height: 100vh; top: 0; right: 0; bottom: 0; z-index: 999; background: rgb(0 0 0 / 80%);}
.header .login_modal .login_wrap {width: 100%; max-width: 720px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #fff; border-radius: 30px; padding: 55px 60px 50px;}
.header .login_modal .login_wrap fieldset {display: flex; flex-flow: column;}
.header .login_modal .login_wrap p{font-size:15px;text-align:left;color:#222;line-height:45px;font-weight:400;}
.header .login_modal .login_wrap .loginform {margin-top: 20px;}
.header .login_modal .login_wrap .loginform input {border: 1px solid #f0f0f0; font-size: 16px; font-weight: 400; color:#333; padding: 16px 20px; margin-bottom: 12px;}
.header .login_modal .login_wrap .loginform input::placeholder {color:#999;}
.header .login_modal .login_wrap .loginform .check_wrap {margin: 10px 0 20px;}
.header .login_modal .login_wrap .loginform .check_wrap label {font-size: 16px; font-weight: 400; color:#999; }
.header .login_modal .login_wrap .loginform button {background-color: #000; padding: 14px 10px;}
.header .login_modal .login_wrap .loginform button h5 {color:#fff; font-weight: 600; font-size: 20px;}
.header .login_modal .login_close_btn {display: inline-block; width: 30px; height: 30px; position: absolute; right: 50px;  top: 40px; cursor: pointer; z-index: 1;}
.header .login_modal .login_close_btn span {display: inline-block; background: #aaa; height: 37px; position: relative; width: 2px; transform: rotate( 135deg); left: 10px;}
.header .login_modal .login_close_btn span::after { content: ""; background: #aaa; height: 2px; position: absolute; top: 17px; left: -17px; width: 37px;}





/** footer **/
.quick_menu {position: fixed; top: 300px; right: 16px; z-index: 9; }
.quick_menu .quick_box {width: 110px; box-shadow: 0px 3px 15px rgb(0 0 0 / 5%);  border-radius: 50px; overflow: hidden;}
.quick_menu .quick_box .box {text-align: center; padding: 20px 0; display: block;}
.quick_menu .quick_box .box.box1 {background-color: #ea5413; padding-top: 40px;}
.quick_menu .quick_box .box.box2 {background-color: #fff; padding-bottom: 30px;}
.quick_menu .quick_box .box .f14 {font-weight: 700; color:#fff; margin-top: 12px; line-height: 18px;}
.quick_menu .quick_box .box .f13 {font-weight: 400; color:#888;}
.quick_menu .quick_box .box .quick_ic1 {width: 58px;}
.quick_menu .quick_box .box .quick_ic2 {width: 35px;}
.quick_menu .top_btn {display: flex; justify-content: center; align-items: center; cursor: pointer; margin-top: 10px;}
.quick_menu .top_btn .arrow {margin-left: 8px;}
.quick_menu .top_btn .arrow span {display: inline-block; width: 7px; height: 7px; transform: rotate(45deg);}
.quick_menu .top_btn .arrow span::before {content: ''; position: absolute; width: 100%; height: 100%; border: 1px solid #888; border-right: 0; border-bottom: 0;}
.quick_menu .top_btn .f16 {font-weight: 500; color:#888; letter-spacing: 0;}
.footer_wrap {background-color: #efeae3; padding: 70px 0 60px;}
.footer_wrap .ft_con {    display: flex;justify-content: center;align-items: center;}
.footer_wrap .logo {background: url('../img/ft_logo_x3_new2.png') no-repeat center / cover; width: 176px; height: 107px; flex-shrink: 0; margin-right: 0px; margin-bottom: 0px;}
.footer_wrap .text_wrap {display: flex; width: 100%;}
.footer_wrap .text_wrap .txt_con {width: 50%; padding: 0 10px;}
.footer_wrap .text_wrap .txt_con.left {}
.footer_wrap .text_wrap .txt_con.right {}
.footer_wrap .text_wrap .txt_con .f28 {color:#333;}
.footer_wrap .text_wrap .txt_con ul {margin-top: 4px;}
.footer_wrap .text_wrap .txt_con ul li {font-size: 18px; line-height: 32px; color:#333; font-weight: 400; word-break: keep-all;}
.footer_wrap .text_wrap .txt_con ul li span.sign {font-size: 18px; line-height: 32px; color:#333; font-weight: 400; margin: 0 22px;}
.footer_wrap .text_wrap .txt_con ul li strong {font-weight: 400; margin-right: 12px;}




/** Sub Page **/
.sub_title {margin-top: 110px;}
.sub_title .f22 {font-weight: 700; color:#ff5a20;}
.sub_title .f22 span {display: inline-block; width: 78px; height: 1px; background-color: #ff5a20; vertical-align: middle; margin-left: 12px;}
.sub_title .f64 {margin-top: 18px;}
.sub_tab {margin-top: 25px; margin-bottom: 65px;}
.sub_tab ul {display: flex;}
.sub_tab ul li {margin-right: 12px; }
.sub_tab ul li:last-child {margin-right: 0;}
.sub_tab ul li a.f16 {display: inline-block; color:#666; padding: 8px 24px; border-radius: 50px; cursor: pointer; border: 1px solid #ddd;}
.sub_tab ul li:hover a.f16, .sub_tab ul li.active a.f16 {background-color: #ff5a20; border: 1px solid #ff5a20; color:#fff;}
.top_bg {height: 462px; display: flex; align-items: flex-end; padding-bottom: 60px;}
.top_bg .f64 {color:#111;}
.top_img {border-radius: 20px; overflow: hidden; display: flex; justify-content: center;}
.sub_full {padding-top: 110px !important;}



/** Pagination**/
.pagination {text-align: center; display: flex; align-items: center; justify-content: center;}
.pagination span {margin: 0 10px; display: flex; align-items: center; justify-content: center;}
.pagination a {font-size: 17px; color:#b8b8b8; font-weight: 500; width: 10px; margin: 0 2px; line-height: 22px; display: inline-block; vertical-align: top; display: flex; align-items: center; justify-content: center; width: 41px; height: 41px;}
.pagination a:hover, .pagination a.on {color:#fff; background-color: #000; border-radius: 50%; }
.pagination a.first {background: url('../img/pagination_first.png') no-repeat center / 17px 15px;}
.pagination a.prev {background: url('../img/pagination_prev.png') no-repeat center / 8px 15px;}
.pagination a.next {background: url('../img/pagination_next.png') no-repeat center / 8px 15px;}
.pagination a.last {background: url('../img/pagination_last.png') no-repeat center / 17px 15px;}
.pagination a.first, .pagination a.prev, .pagination a.next, .pagination a.last {font-size: 0;}
.pagination a.move {width: 17px; margin: 0 14px; flex-shrink: 0;}
.pagination a.move:hover {border: none;}










@media (max-width: 1750px) {
   .header_con {padding: 0 16px;}
   .footer_wrap .ft_con {padding: 0 16px;}

   
}



@media (max-width: 1600px) {
   .footer_wrap .logo {}

}



@media (max-width: 1440px) { 
   .f132 {font-size: 110px; line-height: 120px; letter-spacing: -2px; word-break: keep-all;}
   .f76 {font-size: 56px; line-height: 66px; letter-spacing: -2px; word-break: keep-all;}
   .f70 {font-size: 50px; line-height: 60px; letter-spacing: -2px; word-break: keep-all;}
   .f64 {font-size: 48px; line-height: 58px; letter-spacing: -2px; word-break: keep-all;}
   .f55 {font-size: 45px; line-height: 55px; letter-spacing: -2px; word-break: keep-all;}
   .f50 {font-size: 40px; line-height: 50px; letter-spacing: -2px;}
   .f48 {font-size: 38px; line-height: 48px; letter-spacing: -1px;}
   .f46 {font-size: 36px; line-height: 56px; letter-spacing: -1px;}
   .f45 {font-size: 35px; line-height: 55px; letter-spacing: -1px;}
   .f36 {font-size: 32px; line-height: 40px;}


   .header_con .navigator .header-menu li {padding: 0 16px;}
   .header_con .navigator .header-menu li a {font-size: 16px;}
   

   .footer_wrap .text_wrap .txt_con ul li {font-size: 16px;}
   
   .container {padding-top: 70px;}
   .footer_wrap .text_wrap {flex-flow: column;}
   .footer_wrap .text_wrap .txt_con {width: 100%;}
   .footer_wrap .text_wrap .txt_con.right {margin-top: 40px;}

   table th.f24 {font-size: 20px; line-height: 28px;}
   table td .f20 {font-size: 18px; line-height: 28px;}
   
   .top_bg {height: 30vw; padding-bottom: 3vw;}
   

}




@media (max-width: 1199px) { 
   .container {padding-bottom: 120px;padding-top:110px;}

   .header .m_menu_btn {display: inline-block; margin-left: 20px;}
   .header .navigator {display: none;}
   .header_con {height: 110px;}
   .main .main_bg{top:118px;}


   .f48 {font-size: 35px; line-height: 43px;}
   .f46 {font-size: 34px; line-height: 42px;}
   .f45 {font-size: 33px; line-height: 41px;}
   .f36 {font-size: 31px; line-height: 39px;}
   .f34 {font-size: 30px; line-height: 38px;}
   .f30 {font-size: 28px; line-height: 36px;}
   .f28 {font-size: 26px; line-height: 34px;}
   .f27 {font-size: 24px; line-height: 32px;}
   .f26 {font-size: 22px; line-height: 30px;}
   .f24 {font-size: 20px; line-height: 28px;}
   .f23 {font-size: 19px; line-height: 27px;}
   .f22 {font-size: 19px; line-height: 27px;}
   .f20 {font-size: 18px; line-height: 26px;}
   .section {margin-bottom: 200px;}
   .search_bar input {font-size: 17px;}

   .video_wrap .play_btn2 {width: 150px; height: 150px;}

   table th {padding: 10px 10px;}
   table th.f24 {font-size: 18px; line-height: 26px;}
   table td .f20 {font-size: 16px; line-height: 26px;}
   .top_img {height: 35vw;}
   .sub_full {padding-top: 70px !important;}


}



@media (max-width: 1024px) { 
   .pc {display: none;}
   .m {display: inline-block;}

   .container {
		padding-top: 115px;
	}

   .header_con {
		height: 115px;
	}

   .quick_menu {display: none;}
   .section {margin-bottom: 150px;}
   .pagination a.first {background: url('../img/pagination_first_x3.png') no-repeat center / 17px 15px;}
   .pagination a.prev {background: url('../img/pagination_prev_x3.png') no-repeat center / 8px 15px;}
   .pagination a.next {background: url('../img/pagination_next_x3.png') no-repeat center / 8px 15px;}
   .pagination a.last {background: url('../img/pagination_last_x3.png') no-repeat center / 17px 15px;}   
   .pagination a {font-size: 15px;}
   
   .sub_title {margin-top: 70px;}


}



@media (max-width: 959px) { 
   /** font **/
   .f132 {font-size: 90px; line-height: 100px; letter-spacing: -0.5px;}
   .f76 {font-size: 46px; line-height: 56px; letter-spacing: -0.5px;}
   .f70 {font-size: 40px; line-height: 50px; letter-spacing: -0.5px;}
   .f64 {font-size: 38px; line-height: 46px; letter-spacing: -0.5px;}
   .f55 {font-size: 35px; line-height: 45px; letter-spacing: -0.5px;}
   .f50 {font-size: 32px; line-height: 42px; letter-spacing: -0.5px;}
   .f48 {font-size: 31px; line-height: 39px;}
   .f46 {font-size: 30px; line-height: 38px;}
   .f45 {font-size: 30px; line-height: 38px;}
   .f36 {font-size: 26px; line-height: 34px;}
   .f34 {font-size: 25px; line-height: 33px;}
   .f30 {font-size: 24px; line-height: 32px;}
   .f28 {font-size: 23px; line-height: 31px;}
   .f27 {font-size: 22px; line-height: 30px;}
   .f26 {font-size: 21px; line-height: 29px;}
   .f24 {font-size: 20px; line-height: 28px;}
   .f23 {font-size: 18px; line-height: 26px;}
   .f22 {font-size: 18px; line-height: 26px;}
   .f20 {font-size: 18px; line-height: 26px;}
   .f18 {font-size: 17px; line-height: 25px;}
   .f17 {font-size: 16px; line-height: 24px;}
   .f16 {font-size: 16px; line-height: 24px;}
   .f14 {font-size: 14px; line-height: 22px;}
   .f13 {font-size: 13px; line-height: 21px;}

   .footer_wrap .logo {}
   .list_box .play_btn {width: 100px; height: 100px;}
   table th.f24 {font-size: 16px; line-height: 24px;}

   input, input::placeholder, select {font-size: 16px;}


}



@media (max-width: 767px) {
   .f132 {font-size: 70px; line-height: 80px;}
   .f76 {font-size: 36px; line-height: 44px;}
   .f70 {font-size: 34px; line-height: 42px;}
   .f64 {font-size: 32px; line-height: 40px;}
   .f55 {font-size: 30px; line-height: 38px;}
   .f50 {font-size: 29px; line-height: 37px;}
   .f48 {font-size: 27px; line-height: 37px;}
   .f46 {font-size: 28px; line-height: 36px;}
   .f45 {font-size: 28px; line-height: 36px;}
   .f36 {font-size: 27px; line-height: 35px;}
   .f34 {font-size: 26px; line-height: 34px;}
   .f30 {font-size: 24px; line-height: 32px;}
   .f28 {font-size: 22px; line-height: 30px;}
   .f27 {font-size: 18px; line-height: 26px;}
   .f26 {font-size: 18px; line-height: 26px;}
   .f24 {font-size: 17px; line-height: 25px;}
   .f23 {font-size: 17px; line-height: 25px;}
   .f22 {font-size: 17px; line-height: 25px;}
   .f20 {font-size: 16px; line-height: 24px;}
   .f18 {font-size: 16px; line-height: 24px;}
   .f16 {font-size: 15px; line-height: 23px;}

   .container {padding-bottom: 90px;}
   .section {margin-bottom: 120px;}

   .footer_wrap .logo {margin-bottom: 15px;}
   .footer_wrap .ft_con {flex-flow: column;}
   .footer_wrap .text_wrap .txt_con {padding: 0;}
   .footer_wrap .text_wrap .txt_con.right {margin-top: 20px;}
   .footer_wrap .text_wrap .txt_con ul li {font-size: 15px; line-height: 23px;} 

   .header .login_modal .login_wrap {width: calc(100% - 32px); padding: 40px 30px 30px;}
   .header .login_modal .login_close_btn {right: 30px; top:35px;}

   .search_bar input {max-width: 100%;}

   table th.f24 {font-size: 15px; line-height: 23px;}
   table td .f20 {font-size: 14px; line-height: 22px;}

   .top_bg {height: 200px; padding-bottom: 20px;}
   .sub_tab {margin-top: 15px; margin-bottom: 40px;}

}



@media (max-width: 640px) {
   .header_con .right_menu .login_btn {padding: 8px 20px;}
	.header_con .right_menu .log{
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.header_con .right_menu .login_btn.logn_2{
		margin-right:0;
		margin-bottom:10px;
	}

   .f132 {font-size: 60px; line-height: 68px;}
   .f76 {font-size: 32px; line-height: 40px;}
   .f70 {font-size: 30px; line-height: 38px;}
   .f64 {font-size: 29px; line-height: 37px;}
   .f55 {font-size: 28px; line-height: 36px;}
   .f50 {font-size: 26px; line-height: 34px;}
   .f48 {font-size: 26px; line-height: 34px;}
   .f46 {font-size: 26px; line-height: 34px;}
   .f45 {font-size: 26px; line-height: 34px;}
   .f36 {font-size: 24px; line-height: 32px;}
   .f34 {font-size: 24px; line-height: 32px;}
   .f30 {font-size: 22px; line-height: 30px;}
   .f28 {font-size: 20px; line-height: 28px;}

   .more_btn {width: 150px; height: 46px; padding: 10px 6px;}

   .footer_wrap .text_wrap .txt_con ul li span.txt {display: block;}
   .footer_wrap .text_wrap .txt_con ul li span.sign {display: none;}

   .footer_wrap .text_wrap .txt_con ul li strong {margin-right: 8px;}
   .header .login_modal .login_wrap {padding: 30px;}
   .header .login_modal .login_close_btn {right: 30px; top: 30px;}
   .header .login_modal .login_close_btn span {height: 30px;}
   .header .login_modal .login_close_btn span::after {width: 30px; top: 14px; left: -14px;}
   .header .login_modal .login_wrap .loginform input {font-size: 15px;}
   .header .login_modal .login_wrap .loginform .check_wrap label {font-size: 15px;}
   .header .login_modal .login_wrap .loginform button h5 {font-size: 18px;}

   .pagination a, .pagination a:hover, .pagination a.on {width: 30px; height: 30px;}
   .pagination a.move {width: 17px; margin: 0 8px;}
   .pagination span {margin: 0 6px;}
   .search_bar input {font-size: 16px; padding: 12px 20px;}

   .sub_tab ul {justify-content: space-between;}
   .sub_tab ul li {flex-shrink: 1; flex-grow: 1; margin-right: 6px; text-align: center; }
   .sub_tab ul li a.f16 {padding: 8px 0; width: 100%; line-height: 18px;}

   .sub_title {margin-top: 50px;}
   table td {padding: 8px 8px;}
   .left_title_wrap {padding: 60px 0 70px;}

}







@media (max-width: 479px) {
   .f132 {font-size: 50px; line-height: 60px;}
   .f76 {font-size: 30px; line-height: 38px;}
   .f70 {font-size: 28px; line-height: 36px;}
   .f64 {font-size: 27px; line-height: 35px;}
   .f55 {font-size: 26px; line-height: 34px;}
   .f50 {font-size: 25px; line-height: 33px;}
   .f48 {font-size: 22px; line-height: 30px;}
   .f46 {font-size: 22px; line-height: 30px;}
   .f45 {font-size: 22px; line-height: 30px;}
   .f36 {font-size: 20px; line-height: 29px;}
   .f34 {font-size: 20px; line-height: 29px;}
   .f30 {font-size: 19px; line-height: 27px;}
   .f28 {font-size: 19px; line-height: 27px;}

   .more_btn {width: 36px; height: 36px; display: flex; justify-content: center; align-items: center;}
   .more_btn .f18 {font-size: 15px;}
   .more_btn .f18 span.txt {display: none;}
   .more_btn .f18 span.plus {margin-left: 0;}

   .main .left_tab .f20 {margin-right: 20px;}
   .main .left_tab .f20:last-child {margin-right: 0;}
   .main .left_tab .f20 .arrow {width: 15px;}
   .main .left_tab .f20 .arrow span::after {width: 15px;}

   .section {margin-bottom: 90px;}

   .sub_tab {margin-bottom: 25px;}
   .sub_tab ul {flex-flow: wrap;}
   .sub_tab ul li {flex: 1 1 calc(50% - 6px); margin-bottom: 6px;}
   .sub_tab ul li:nth-child(even) {margin-right: 0;}
   .sub_tab ul li .f16 {font-size: 14px;}
   
   .list_box .play_btn {width: 80px; height: 80px;}
   .video_wrap .play_btn2 {width: 100px; height: 100px;}
   .top_img {height: 160px; border-radius: 10px;}
   .top_bg {height: 170px;}
   .sub_title .f22 span {width: 60px;}

}



@media (max-width: 374px) {
   .f132 {font-size: 40px; line-height: 50px;}
   .pagination a {margin: 0 1px;}
   .pagination a.move {margin: 0 5px;}

   .f36 {font-size: 21px; line-height: 29px;}
   .f34 {font-size: 21px; line-height: 29px;}
   .f30 {font-size: 20px; line-height: 28px;}
   .f28 {font-size: 20px; line-height: 28px;}



}