

@media screen and (max-width:720px) {
    .show_720 {display: block;}
    .hide_720 {display: none;}
	
    
    /**** 공통 ****/
    .container {width:100%; padding: 0 15px;}
    body {min-width: 100%;}
    body.open_menu {overflow: hidden; height: 100%;}
    .pad_t_100 {padding-top: 10%;}
    .pad_b_100 {padding-bottom: 10%;}
    .pad_t_150 {padding-top: 15%;}
    .pad_b_150 {padding-bottom: 15%;}
    .mar_b_50 {margin-bottom: 5%}
    .mar_b_100 {margin-bottom: 10%}
    .mar_t_100 {margin-top: 10%}
    .mar_t_150 {margin-top: 15%}
    .title {}
    .title h2 {font-size: 24px; line-height: 30px; margin-bottom: 30px;}
    .title p {font-size: 16px; line-height: 30px;}
    .title .sub {font-size: 18px; line-height: 18px; padding: 10px 15px;}
    
    .table_type_1 th, .table_type_1 td {display: block; text-align: left; padding: 15px 0; font-size: 16px; line-height: 26px;}
    .table_type_1 th {padding-bottom: 0;}
    
    .table_type_2 {margin-top: 20px;}
    .table_type_2 th, .table_type_2 td {height: 50px; font-size: 16px; line-height: 16px;}
    
    .info_box {padding: 15px; max-height: 230px;}
    .info_box .list h4 {font-size: 16px;}
    
    /*모바일 헤더*/
    #mobile_header {z-index: 100; text-align: center; height: 75px}
    #mobile_header .logo {top: 20px; left: 15px; position: absolute; margin: 0;}
    #mobile_header .logo img {width: 150px;}
    
    .mobile_btn {box-sizing: content-box; position: absolute; z-index: 31; display: block; right: 15px; top: 23px; width: 22px; height: 18px; padding: 6px; -webkit-transition: all .3s ease; transition: all .3s ease;}
	.mobile_btn .bar, .mobile_btn .bar:before, .mobile_btn .bar:after {content: ''; position: absolute; right: 6px; height: 2px; width: 100%; background-color: white; opacity: 1; text-indent: -9999em;}
	.mobile_btn .bar {top: 14px; width: 16px; -webkit-transition: height .3s .3s; transition: height .3s .3s;}
	.mobile_btn .bar:before {top: -8px; right: 0; width: 22px; -webkit-transition: top .3s .3s, transform .3s, width .3s .3s; 	transition: top .3s .3s, transform .3s, width .3s .3s;}
	.mobile_btn .bar:after {top: 8px; right: 0; width: 22px; -webkit-transition: top .3s .3s, transform .3s, width .3s .3s; 	transition: top .3s .3s, transform .3s, width .3s .3s;}

	.open_menu .mobile_btn .bar {height: 0; background-color: rgba(255,255,255,1); -webkit-transition: height .3s; transition: height .3s;}
	.open_menu .mobile_btn .bar:before {top: 0; width: 22px; background-color: rgba(255,255,255,1); -webkit-transform: rotate3d(0,0,1,45deg); -ms-transform: rotate3d(0,0,1,45deg); transform: rotate3d(0,0,1,45deg); -webkit-transition: top .3s, transform .3s .3s, width .3s; transition: top .3s, transform .3s .3s, width .3s;}
	.open_menu .mobile_btn .bar:after {top: 0; width: 22px; background-color: rgba(255,255,255,1); -webkit-transform: rotate3d(0,0,1,-45deg); -ms-transform: rotate3d(0,0,1,-45deg); transform: rotate3d(0,0,1,-45deg); -webkit-transition: top .3s, transform .3s .3s, width .3s; transition: top .3s, transform .3s .3s, width .3s;}

    /*모바일 메뉴*/
    #mobile_menu_wrap {position: fixed; display: block; z-index: 30; left: 100%; right: 0; top: 0; height: 100%; background-color: #010b0d; overflow: hidden; color: #fff; -webkit-transition: left .3s; transition: left .3s;}
    .open_menu #mobile_menu_wrap {left: 0;}
    #mobile_menu_wrap .menu {position: absolute; right: 0; width: 100vw; height: 100%;}
    #mobile_menu_wrap .menu .m_gnb {text-align: center;}
    #mobile_menu_wrap .menu .m_gnb li {margin-bottom: 30%;}
    #mobile_menu_wrap .menu .m_gnb li:last-child {margin-bottom: 0;}
    #mobile_menu_wrap .menu .m_gnb li a {font-size: 30px; color: white; display: block; font-family: 'Poppins', sans-serif; font-weight: 700;}
    #mobile_menu_wrap .menu .m_gnb li:hover a {color: #ffd200;}
    
    
    /**** section_1 ****/
    #section_1 {margin-top: 75px;}
    #section_1 .title {padding: 15vh 10%;}
    
    /**** section_2 ****/
    #section_2 .text_box {padding: 30px 20px;}
    #section_2 .text_box p {font-size: 16px; line-height: 30px;}
    
    /**** section_3 ****/
    #section_3 .text_box {width: 100%; padding: 0 30px;}
    #section_3 .text_box p {font-size: 20px; line-height: 35px;}
    
    /**** section_4 ****/
	#section_4 {height: 100%; padding-bottom: 15%;}
    #section_4 .title img {padding: 0 10%;}
	#section_4 .swiper-pagination {bottom:20px;}
    #section_4 .swiper-pagination-bullet {width: 20px; height: 30px; background-size: 20px;}
    #section_4 .swiper-button-next, #section_4 .swiper-button-prev {display: none; top: 11.5%; width: 40px; height: 40px; background-size: 40px;}
	#section_4 .swiper-button-prev {left: auto;right: 65px;}
	#section_4 .swiper-slide {padding-bottom: 100px;}
    #section_4 .swiper-slide .text {position: relative; top: auto; transform: none; margin-top: 50px; }
    #section_4 .swiper-slide .text .wrap {max-height: 250px; overflow-y: auto;}
    #section_4 .swiper-slide .text .title {max-width: 45%; margin-bottom: 8%;}
    #section_4 .swiper-slide .text p {font-size: 16px; line-height: 28px;}
    
    
    /**** section_5 ****/
    #section_5 {background: url(/namhae/images/section_5_bg.jpg) repeat center; background-size: 180%;}
    #section_5 .flip {padding-bottom: 150%;}
    #section_5 .swiper-container {padding-bottom: 65px;}
	#section_5 .swiper-pagination-bullet {background: url('/images/section_4_slide_dot.png') no-repeat center; width: 20px; height: 30px; background-size: 20px;}
    
    /**** section_8 ****/
    #section_8 h2 {font-size: 24px; line-height: 30px;}
    #section_8 .info {margin-bottom: 50px;}
    #section_8 .info h3 {font-size: 16px; line-height: 18px;}
    #section_8 .info p {font-size: 14px; line-height: 26px; margin-top: 15px;}
    
    
    /**** section_9 ****/
    #section_9 .swiper-slide .box {padding: 25px;}
    #section_9 .swiper-slide .title p {font-size: 14px; line-height: 24px;}
    #section_9 .swiper-slide .title h3 {font-size: 24px; line-height: 24px;}
    #section_9 .swiper-slide .img {float: none;}
    #section_9 .swiper-slide .text {float: none; width: 100%; padding: 0; margin-top: 30px;}
    #section_9 .swiper-slide .text h4 {font-size: 16px; line-height: 26px; margin-bottom: 20px;}
    #section_9 .swiper-slide .text p {font-size: 16px; line-height: 26px;}
    
    #section_9 .poster_box img {float: none; width: 100%;}
    #section_9 .poster_box .text {float: none; width: 100%; padding: 25px; margin-top: 30px;}
    #section_9 .poster_box .text p {font-size: 16px; line-height: 30px;}
    
    /**** section_10 ****/
    #section_10 .logo_part {float: none; text-align: center; margin-top: 20px;}
    #section_10 .logo_part img {max-width: 60%;}
    #section_10 .logo_part p {font-size: 16px; line-height: 16px; margin-top: 20px;}
    #section_10 .info_part {float: none; margin-left: 0; margin-top: 30px;}
    #section_10 .info_part .info h3 {display: block; text-align: center; margin-bottom: 20px; font-size: 18px;}
    #section_10 .info_part .info p {font-size: 16px; line-height: 16px;}
    #section_10 .info_part .info img {margin-left: 0; vertical-align: middle;}
    
    /**** footer ****/
    footer {text-align: center;}
    footer h3 {position: relative; right: auto; bottom: auto; font-size: 16px; line-height: 26px; margin-top: 30px;}
    footer .info p {font-size: 14px; line-height: 28px;}
    footer .info .copy {font-size: 12px; line-height: 12px;}
    
    
    
}
