/* 2021 리뉴얼 메인페이지 CSS
===================================================================================
*/

#main {padding-top: 98px; margin-bottom: 5rem;margin-top:-24px;}
.content-area {width:1200px;margin:0 auto; position: relative;} 
.visual {position:relative;}
.visual .swiper-slide .img {width:100%;}
.visual .swiper-slide .mainVisual_txt {position: absolute; left: 50%; top:45%; transform:translate(-50%,-50%); font-size: 2.8125rem; color: #fff; line-height: 1.4; font-weight: 600; text-align: center;}
.visual .visual-pagination {text-align: center;position: absolute;bottom: 8% !important;left:0;z-index: 99;}
.visual .visual-pagination > span {width:50px;height:3px;background-color:#f3f3f3;opacity:100%;border-radius:0%;display:inline-block;}
.visual .visual-pagination > span.swiper-pagination-bullet-active {width:75px;background-color:#004b8d}
.visual .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {height:8px;margin: 0 0.5rem;}
.visual .swiper-notification {display: none;}
.visual .swiper-button-prev {z-index:999;color:#fff;/*background-image:url('/wp-content/themes/grihome/images/main/swiper_prev.png');*/}
.visual .swiper-button-next	{z-index:999;color:#fff;/*background-image:url('/wp-content/themes/grihome/images/main/swiper_next.png');*/}
.vi_slide_box {text-align:right}
.vi_slide {display:inline-block;cursor:pointer;color:#fff;padding:10px;background:#004b8d}

.main_sec01 {margin-top: 3.5rem;margin-bottom:70px; position:relative;}
.main_sec01:after { display:block; content:""; clear:both;}
.main_sec01 .msec01_left {float:left;width:calc(50% - 10px); position: relative;}
.main_sec01 .msec01_right {float:right;width:calc(50% - 10px); position: relative;}
.main_sec01 .msec_board_wrap {}
.main_sec01 .board_box {border: 1px solid #d7d7d7; box-sizing:border-box;overflow: hidden; }
.msec01_left .board_box + .board_box {margin-top: 25px;}
.msec01_left .board_box .list_con {height: 306px; position: relative;}
.msec01_left .board_box .list_con:before {content:''; width: 1px; height: 100%; background: #d7d7d7; position: absolute; left: 50%; top:0;}
.msec01_left .board_box .list_con li {float: left; width: 50%;box-sizing:border-box; padding: 1.25rem;}
.msec01_left .board_box .list_con a {display: block;}
.msec01_left .board_box .list_con a img {width: 110px;height: auto;display: block; margin: auto;border: 1px solid #efefef;}
.msec01_left .board_box .list_con a p {line-height: 1.5;}
.msec01_left .board_box .list_con .lc_tit {font-weight: 600; font-size: 1.1rem; margin: 1rem 0; width: 100%; text-overflow: ellipsis; height: 3em; overflow: hidden; line-height: 1.5; max-height: 3em; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}
.board_box .sec_more {border-top: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7;position: relative;}
.board_box .sec_more p {width: 180px; background: #004b8d; font-weight: 600; text-align: center; color: #fff; padding: 0.875rem 0;}
.board_box .sec_more .btn_more {position: absolute; right: 6px; top:4px;}
.slider_option {border-top:1px solid #d7d7d7; position: relative; height: 40px;}
.slider_option .btnSlide {position: absolute; right: 1.25rem; top: 11px;}
.slider_option .btnSlide img {padding: 5px 2px; cursor: pointer;}
.slick-arrow.slick-prev, .slick-arrow.slick-next {position: absolute; top: 45%; transform: translateY(-50%);z-index: 99; outline:none; text-indent:-9999px; padding: 0; width: 30px; height: 30px; }
.slick-arrow.slick-prev {left: 0px; background: #818181 url('../images/main/icon_arrow_prev.png') center no-repeat;}
.slick-arrow.slick-next {right: 0px; background: #818181 url('../images/main/icon_arrow_next.png') center no-repeat;}
.slick-dots {position: absolute; bottom: -1.625rem; left: 1.25rem; z-index: 99;}
.slick-dots li {float: none; display: inline-block; width: auto !important; padding: 0 !important; }
.slick-dots li + li {margin-left: 10px;}
.slick-dots li button {width: 8px; height: 8px; border-radius: 50%; background: #5b5b5b; padding: 0; text-indent: -9999px;}
.slick-dots li.slick-active button {background: #004b8d;}

.msec01_right {}
.msec01_right .issue_list_con { }
.msec01_right .issue_list_con li {padding: 0.5rem 1.25rem; border-bottom: 1px solid #d7d7d7; box-sizing: border-box;}
.msec01_right .issue_list_con li:last-child {border-bottom: none;display:none;}
.msec01_right .issue_list_con li a {display: table; width: 100%; table-layout:fixed;}
.msec01_right .issue_list_con .lc_img {display: table-cell; width: 140px;border: 1px solid #efefef;}
.msec01_right .issue_list_con .lc_info {display: table-cell; width:80%;/*width: calc(100% - 140px);*/ padding-left: 1.5rem; vertical-align: middle;}
.msec01_right .issue_list_con .lc_info .lc_tit {font-weight: 600; font-size: 1.125rem; margin: 0 0 0.5rem; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.msec01_right .issue_list_con .lc_info .lc_desc {line-height: 2.1; margin-bottom: 1rem; width: 100%; height: 4.2em; display: -webkit-box; text-overflow: ellipsis; overflow: hidden; max-height: 4.2em; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.msec01_right .issue_list_con .lc_info .lc_date {}

.main_sec02 {margin-bottom:65px;}
.main_sec02 .quick_m:after {content: '';display: block;overflow: hidden;clear: both;height: 0;}
.main_sec02 .quick_m dt {display: none;}
.main_sec02 .quick_m dd {width:calc(100% / 7);float: left;padding:1rem 0;box-sizing:border-box}
.main_sec02 .quick_m dd:first-of-type {border-right:3px solid #ccc;border-left:3px solid #ccc; width: calc((100% /7) - 1px);}
.main_sec02 .quick_m dd + dd {border-right:3px solid #ccc}
.main_sec02 .quick_m dd.dd_last2 {width: 8%;}
.main_sec02 .quick_m dd a {display:block;}
.main_sec02 .quick_m dd span {display:block;text-align:center;letter-spacing: -1px;}
.main_sec02 .quick_m dd span.tit {margin-top:17px;font-size:16px; font-weight: 500;}
.main_sec02 .quick_m dd span img {width:80px;}

.main_sec03:after {content: '';display: block;overflow: hidden;clear: both;height: 0;}
.main_sec03 .msec03_left {float:left;width:60%;}
.main_sec03 .msec03_left .board_box {display:none;float: left;width: 100%; box-sizing:border-box;position: relative;}
.main_sec03 .tab_btn {border-bottom: 2px solid #d7d7d7;margin-bottom: 50px; position: relative; height: 62px;}
.main_sec03 .tab_btn > p {width: 20%;line-height: 60px;font-size: 25px;font-weight: 800;display: inline-block;}
.main_sec03 .tab_btn > p span {font-size: 25px;font-weight: 800;color: #195d98;}
.main_sec03 .tab_btn > ul {width: 50%; position: absolute;left: 50%; bottom: 0; transform:translateX(-50%);} 
.main_sec03 .tab_btn li {width: 20%;display: inline-block;margin-right: -4px;}
.main_sec03 .tab_btn li.on {border-bottom:2px solid #004b8d}
.main_sec03 .tab_btn li a {font-size: 18px;display: block;text-align: center;line-height: 60px;}
.main_sec03 .tab_btn .btn_more {font-size: 42px;color: #0053a0;font-weight: 300;padding: 1rem;float: right;}
.main_sec03 .msec03_left .board_box.tab_on {display:block}
.main_sec03 .msec03_left .board_box h4 {display:none;}
.main_sec03 .msec03_left .board_box .listb_info {padding: 0 1.5rem; padding-bottom: 50px; border-bottom: 2px solid #d7d7d7;}
.main_sec03 .msec03_left .board_box .listb_info li {width: 100%; display: block; box-sizing: border-box;    overflow: hidden;}
.main_sec03 .msec03_left .board_box .listb_info li:after {content:''; display: block; clear: both; height: 0;}
.main_sec03 .msec03_left .board_box .listb_info li + li {margin-top: 0.875rem;}
.main_sec03 .msec03_left .board_box .listb_info li .new_img {display: none;}

.main_sec03 .msec03_left .board_box .listb_info li > a{overflow: hidden; width: calc(100% - 80px - 80px); float: left; white-space: nowrap; text-overflow: ellipsis;}
.main_sec03 .msec03_left .board_box .listb_info li > .date {float: right; width: 80px; text-align: right;}
.main_sec03 .msec03_left .board_box .btn_more a {height:23px;color: #f8981d; font-size: 42px;position:absolute; right: 2rem; top: 2rem;}
.main_sec03 .msec03_left .board_box .listb_info li .c_blu_txt {font-weight: 700; color: #004b8d; float: left; width: 80px;}
.main_sec03 .msec03_right {width:30%;float:right;position:relative;background-color:#f1f1f1}
.main_sec03 .msec03_right .info_banner {overflow:hidden}
.main_sec03 .msec03_right .info_banner .swiper-slide a img {width:100%}
.main_sec03 .msec03_right .info_banner .swiper-pagination {left: 46%; bottom: 1.5rem; text-align: right; /*padding-right: 3.5rem;*/ box-sizing: border-box; width: 41%;}
.main_sec03 .msec03_right .info_banner .swiper-pagination-bullet {width: 6px; height: 6px; background-color:#fff; border:1px solid #004b8d; border-radius:50%; margin: 2px 4px;}
.main_sec03 .msec03_right .info_banner .swiper-pagination-bullet-active {background-color:#004b8d}
.main_sec03 .msec03_right .info_banner_txt {padding: 0 1rem 1.5rem;}
.main_sec03 .msec03_right .info_banner_txt > p {font-size:18px;color:#333; padding-left: 5%;}
.main_sec03 .msec03_right .info_m_txt {display: none;}
.main_sec03 .msec03_right .auto_box {text-align: right;position: absolute;right: 1rem;bottom: 1.6rem;}

.gri_sns {/*margin-top: 50px;*/margin-top: 20px;position:relative;}
.gri_sns > p {font-size: 25px;font-weight: 800;/*display: inline-block;*/margin-bottom: 6px;}
.gri_sns > p span {font-size: 25px;font-weight: 800;color: #195d98;}
.gri_sns .snsList {width:300px;display: inline-block;vertical-align:bottom;}
.gri_sns .snsList li {/*float: left;*/display:inline-block;margin-bottom: 10px;}
.gri_sns .snsList li + li {padding-left: 10px; /*border-left: 1px solid #c1c1c1;*/}
.gri_sns .snsList li:nth-of-type(3) {padding-left: 0;margin-bottom:0;}
.gri_sns .snsList li:nth-of-type(4) {margin-bottom:0;}
.gri_sns .snsList li a {border-radius: 20px;background: #333;color: #fff;width: 100px;height: 35px;display: inline-block;}
.gri_sns .snsList li a img {margin-left: 6px;margin-bottom: 1px;height: 30px;display: inline-block;}
.gri_sns .snsList li:nth-of-type(1) a {background:#2bb500;}
.gri_sns .snsList li:nth-of-type(2) a {background:#304f88;}
.gri_sns .snsList li:nth-of-type(3) a {background:#2aa3ce;}
.gri_sns .snsList li:nth-of-type(4) a {background:#e90101;}
.gri_sns .snsList li a span {width: 53px;text-align: center;font-size: 14px;color: #fff;line-height: 35px;/*margin: 0 1.375rem; font-size: 1.125rem; color: #555;*/}

.gri_sns .web_banner {display: inline-block;width: 415px;height:94px;overflow: hidden;vertical-align:bottom;position:relative;}
.gri_sns .web_banner .swiper-slide img {margin:0 auto;display:block;}
.gri_sns .web_banner .swiper-button-prev {width:25px;height:15px;position:absolute;left:7px;overflow: hidden;transform: translateY(14px);color:#929292;}
.gri_sns .web_banner .swiper-button-next {width:25px;height:15px;position:absolute;right:7px;overflow: hidden;transform: translateY(14px);color:#929292;}

/* 메일 팝업 */
#mailPopup {position: fixed; right: 0; bottom:0; width: 645px; height: 200px; background: #e6e6e6; z-index: 99;}
#mailPopup .mailTabs {width: 100%; box-sizing: border-box; padding: 0.25rem 0.5rem; margin: 0.5rem 0 0.75rem;}
#mailPopup .mailTabs li {width: 100%; float: left; text-align: center;}
#mailPopup .mailTabs li a {padding: 0.25rem 0.25rem 0.25rem; display: inline-block; letter-spacing: -0.5px; font-weight: 500; color: #999; font-size: 1.125rem; border-bottom: 2px solid transparent;}
#mailPopup .mailTabs li.on a {color: #333; border-bottom-color:#195d98;}
#mailPopup .close {right: 0; height: 50px; padding: 0; text-align: center; line-height: 45px; cursor: pointer;}
#mailPopup .mainCon > div {display: none; text-align: center;}
#mailPopup .mainCon > div.on {display: block;}
#mailPopup .mainCon .mail_desc {color: #555; letter-spacing: -0.5px; font-size: 15px;}
#mailPopup .mainCon .mail_address {margin: 0.75rem 0;}
#mailPopup .mainCon .mail_address input {width: 60%; padding: 0.25rem 0.5rem; box-sizing: border-box; max-width: 400px; border: 1px solid #9b9b9b;}
#mailPopup .mainCon .mail_btn {margin: 0.75rem 0;}
#mailPopup .mainCon .mail_btn a {display: inline-block; width: 50%; padding: 0.5rem 0; font-size: 0.875rem; color: #fff; background: #195d98;}