@charset "utf-8";
:root{
    --text_default:#191F28;

    --border_radius_1:8px;
    --border_radius_2:24px;
}

.wrap_mcont{padding-top:0;}

.main_container{position: relative;width:100%;color:var(--text_default);}
.main_container .section{position: relative;}
.main_container .inner{position: relative;width:100%;max-width:1200px;margin:0 auto;}
.main_container .inner::after { content:""; display:block;clear:both;}

.slide_controler{display: flex;align-items: center;justify-content: center; position: relative;text-align: center;}
.slide_controler .slide_paging{display: none;}
.slide_controler .slide_nav{display: flex;align-items: center; margin:0 0px; }
.slide_controler .slide_nav .arrow {overflow:hidden;text-indent: -9999px; display:inline-block;width: 25px; height: 25px; cursor:pointer; z-index: 2;}
.slide_controler .slide_nav .arrow_prev {background: url('../images/main/ico_angle_left.png') no-repeat center center;}
.slide_controler .slide_nav .arrow_next {background: url('../images/main/ico_angle_right.png') no-repeat center center;}
.slide_controler .toggleButton{overflow:hidden;text-indent: -9999px; width: 25px; height: 25px; z-index: 2;background: url('../images/main/ico_pause.png') no-repeat center center;}
.slide_controler .toggleButton.playing{background: url('../images/main/ico_pause.png') no-repeat center center;}
.slide_controler .toggleButton.paused{background: url('../images/main/ico_Play.png') no-repeat center center;background-size: 8px auto;}
.slick-track {display: flex; height: 100%;}
.slick-track .slick-slide {display: flex; height: auto;}

/* .slick-track .slick-slide:focus{border: 2px solid #0768D7;} */

/* section_01 */
.main_container .section_01{background: #F5F8FF;}
.main_container .cont_mainVisual{position:relative; height:368px;}
.main_container .cont_mainVisual .main_slide {overflow:hidden;height:100%;}
.main_container .cont_mainVisual .slick-list{height:100%;}
.main_container .cont_mainVisual dl{padding:35px 0;}
.main_container .cont_mainVisual dl dt{margin:0 0 26px 0;font-size: 48px;font-weight: 500;}
.main_container .cont_mainVisual dl dd{font-size: 24px;line-height: 130%;}
.main_container .cont_mainVisual .item{height:100%;}
.main_container .cont_mainVisual .item_01 { background-image: url('../images/main/visual_bg01.png'); background-repeat: no-repeat; background-position: right top 20px; }
.main_container .cont_mainVisual .item_02 { background-image: url('../images/main/visual_bg02.png'); background-repeat: no-repeat; background-position: right top 20px; }
.main_container .cont_mainVisual .item_03 { background-image: url('../images/main/visual_bg03.png'); background-repeat: no-repeat; background-position: right top 20px; }

.main_container .cont_mainVisual .slide_controler {position:absolute;left:10px;bottom:120px;display: inline-flex;padding: 10px 16px;border-radius: 20px;background: #FFF;}
.main_container .cont_mainVisual .slide_controler .slide_nav .arrow_prev {background: url('../images/main/ico_angle_left_02.png') no-repeat center center;}
.main_container .cont_mainVisual .slide_controler .slide_nav .arrow_next {background: url('../images/main/ico_angle_right_02.png') no-repeat center center;}
.main_container .cont_mainVisual .slide_controler .toggleButton{background: url('../images/main/ico_pause_02.png') no-repeat center center;}
.main_container .cont_mainVisual .slide_controler .toggleButton.playing{background: url('../images/main/ico_pause_02.png') no-repeat center center;}
.main_container .cont_mainVisual .slide_controler .toggleButton.paused{background: url('../images/main/ico_Play_02.png') no-repeat center center;}

.main_container .cont_service{position:absolute;left:0;top:-70px;z-index: 2;}
.main_container .cont_service ul{display: flex;}
.main_container .cont_service .item{position: relative;width: 120px;height: 120px;margin:0 7px;border-radius: 4px; border: 2px solid #FFF; background: rgba(255, 255, 255, 0.60);box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.15);transition: transform 0.5s ease, background-color 0.5s ease;}
.main_container .cont_service .item a{display: block;width:100%;height:100%;padding: 15px 0 0 0;text-align: center;}
.main_container .cont_service .item a:focus { border: 3px dashed #ff6600;}

.main_container .cont_service .item .txt{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;height:35px; margin:60px 0 0 0;font-size: 16px;font-weight: 500;}
.main_container .cont_service .item .txt .br{display: block;width:100%;}
.main_container .cont_service .item::before{content:"";display:block;position:absolute;left:50%;top:16px;width:56px;height:48px;margin-left:-28px;}
.main_container .cont_service .item_01::before{background: url('../images/main/service_img01.png') no-repeat center center; }
.main_container .cont_service .item_02::before{background: url('../images/main/service_img02.png') no-repeat center center;}
.main_container .cont_service .item_03::before{background: url('../images/main/service_img03.png') no-repeat center center;}
.main_container .cont_service .item_04::before{background: url('../images/main/service_img04.png') no-repeat center center;}

.main_container .cont_service .item{position:relative;transition:background-color 0.5s ease,transform 0.5s ease;overflow:hidden;}
.main_container .cont_service .item .txt{position:absolute;left:0;right:0;top:15px;height:35px;display:flex;justify-content:center;align-items:center;transition:opacity 0.5s ease;}
.main_container .cont_service .item .txt_rotate{position:absolute;left:0;right:0;top:75px;height:35px;font-size:13px;display:flex;justify-content:center;align-items:center;transition:opacity 0.5s ease;}
.main_container .cont_service .item .txt{opacity:1;}
.main_container .cont_service .item .txt_rotate{opacity:0;}
.main_container .cont_service .item:hover{border:none;background:linear-gradient(180deg,#7594DE 0%,#3663CD 100%);transform:rotateY(180deg);}
.main_container .cont_service .item:hover .txt{opacity:0;}
.main_container .cont_service .item:hover .txt_rotate{opacity:1;color:#fff; line-height: 130%; word-break: keep-all; transform: rotateY(180deg);}
.main_container .cont_service .item_01:hover::before{background: url('../images/main/service_img01_over.png') no-repeat center center; }
.main_container .cont_service .item_02:hover::before{background: url('../images/main/service_img02_over.png') no-repeat center center;}
.main_container .cont_service .item_03:hover::before{background: url('../images/main/service_img03_over.png') no-repeat center center;}
.main_container .cont_service .item_04:hover::before{background: url('../images/main/service_img04_over.png') no-repeat center center;}

.main_container .cont_appDown{position:absolute;right:0;top:-50px;z-index: 2;}
.main_container .cont_appDown .app_down_box{display: flex;align-items: center; position: relative;width:312px;padding:15px;border-radius:var(--border_radius_1);border: 2px solid #FFF; background: rgba(255, 255, 255, 0.50);box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.20);}
.main_container .cont_appDown a{display: flex;align-items: center;justify-content: center;width:100%;height: 100%;}
.main_container .cont_appDown .logo{margin:0 5px 0 0;}
.main_container .cont_appDown .logo img{width:63px;height:63px;}
.main_container .cont_appDown .txt_01{margin:0 0 5px 0;text-align: center; font-size: 16px;font-weight: 500;line-height: 120%;}
.main_container .cont_appDown .txt_02{display: inline-block; padding:3px 8px;font-size: 12px;font-weight: 600;color: #FFF;text-align: center;border-radius: 16px;background: #5B88D9;}
.main_container .cont_appDown .qr{margin:0 0 0 5px;background: #fff;}
.main_container .cont_appDown .qr img{width:63px;height:63px;border: 1px solid #AEAEAE;}

[data-elememt="tab_panel"] {display:none;}
[data-elememt="tab_panel"].active {display:block;}
.main_container .tit{height:35px;margin:0 0 18px 0;padding:0 0 16px 0;font-size: 18px;font-weight: 600;border-bottom:1px solid #B5B5B5;}

.main_container .section_03{padding:75px 0 30px 0;background: linear-gradient(180deg, #F5F8FF 0%, #8CAEFF 100%);}
.main_container .section_03 .inner{display: flex;justify-content: space-between;}
.main_container .section_03 .inner::after{content:none;display:none;}
.main_container .section_03 .part{position: relative;padding:15px 20px;border-radius:var(--border_radius_1);border: 1px solid #FFF;background: #FFF;box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.20);}
.main_container .section_03 .part_01{width:530px;height:290px;}
.main_container .section_03 .part_02{flex-shrink: 0;width:312px;height:290px;}
.main_container .section_03 .part_03{flex-shrink: 0;width:312px;height:290px;}
.main_container .section_03 .slide_controler{position: absolute;right:55px;top:12px;}
.main_container .section_03 .more{position:absolute;right:20px;top:18px;}
.main_container .section_03 .more a{font-size: 14px;font-weight: 400;color: #6E6E6E;}

.main_container .article_area .tab_wrap{height:35px;margin:0 0 9px 0;border-bottom:1px solid #B5B5B5;}
.main_container .article_area .tab_wrap ul{display: flex;align-items: center;}
.main_container .article_area .tab_wrap ul li ~ li{margin-left:12px;}
.main_container .article_area .tab_wrap button{height:25px;padding:0px 12px;color: #838383;font-size: 18px;font-weight: 500;line-height:150%;border-radius: 8px;background: #E1E1E1;}
.main_container .article_area .tab_wrap button.active{color: #FFF;background: #329CFF;}

.main_container .cont_article .article_list li {display: flex;align-items: center; position: relative;padding:9px 0;overflow: hidden; min-width: 0;width: 100%;}
.main_container .cont_article .article_list li:last-child {border: none;padding-bottom:0;}
.main_container .cont_article .article_list li a {display: block; font-size: 16px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-grow: 1; min-width: 0;}
.main_container .cont_article .article_list li .date{flex-shrink: 0;font-size: 16px; margin-left: 25px;}
.main_container .cont_article .article_list li .ico_new{flex-shrink:0;display:flex;width:52px;height:20px;color:#fff;margin:0 5px 0 0;padding:2px 7px;font-size: 10px;font-weight: 500;justify-content:center;align-items:center;border-radius:20px;background: #329CFF;}
.main_container .cont_article .article_list li .flag{flex-shrink:0;display:flex;width:52px;height:20px;color:#fff;margin:0 5px 0 0;padding:2px 7px;font-size: 10px;font-weight: 500;justify-content:center;align-items:center;border-radius:20px;}
.main_container .cont_article .article_list li .flag_notice{background: #FF6817;}
.main_container .cont_article .article_list li .flag_complete{background: #859AB8;}

.main_container .section_03 .part_01_type02{display: none;}
.main_container .cont_faq .faq_list li {display: flex;align-items: center; position: relative;padding:9px 0;overflow: hidden; min-width: 0;width: 100%;}
.main_container .cont_faq .faq_list li:last-child {border: none;padding-bottom:0;}
.main_container .cont_faq .faq_list li a {display: block; font-size: 16px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-grow: 1; min-width: 0;}

.main_container .cont_promotional {overflow:hidden !important; height:205px;}
.main_container .cont_promotional .main_banner_02 {height:100%;}
.main_container .cont_promotional .slick-list{height:100%;}
.main_container .cont_promotional .item a{display: block;width:100%;height:100%;}
.main_container .cont_promotional .slick-slider img{max-width: 100%;max-height: 100%;margin: 0 auto;} 

.main_container .cont_utilizationApp{overflow:hidden !important;height:205px;}
.main_container .cont_utilizationApp .main_banner_01 {height:100%;}
.main_container .cont_utilizationApp .slick-list{height:100%;}
.main_container .cont_utilizationApp .item a{display: block;width:100%;height:100%;}
.main_container .cont_utilizationApp .thumbnail{display: flex;align-items: center;justify-content: center;width:100%;padding:0px 0px 15px 0px;}
.main_container .cont_utilizationApp .thumbnail .logo img{width: 87px;height: 87px;box-shadow: 2px 2px 0 0 rgba(0, 0, 0, 0.20);border-radius: 21px;}
.main_container .cont_utilizationApp .thumbnail .name{font-size: 24px;font-weight: 500;text-align: center;margin:0 10px;word-break: keep-all;line-height:140%;}
.main_container .cont_utilizationApp .explain{display: flex;align-items: center;justify-content: center;height:100px;font-size: 18px;text-align: center;word-break: keep-all;line-height:140%;border-top:1px solid #9B9B9B;}

@media (max-width: 1200px) {

	#header{border:none;}
    
	.main_container .inner{padding:0 24px 24px 24px;}
    .main_container .section{padding:0px;}

    .main_container .section_01{background: none;}
	.main_container .cont_mainVisual{height:220px;}
	.main_container .cont_mainVisual .main_slide{border-radius: 24px;}
	.main_container .cont_mainVisual dl{padding:20px 15px;}
	.main_container .cont_mainVisual dl dt{margin:0 0 5px 0;font-size:32px;line-height:130%;}
	.main_container .cont_mainVisual dl dd{font-size:18px;line-height:150%;}
	.main_container .cont_mainVisual .item_01,
	.main_container .cont_mainVisual .item_02,
	.main_container .cont_mainVisual .item_03{box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);border-radius:var(--border_radius_2);}

	.main_container .cont_mainVisual .item_01 { background: url('../images/main/visual_bg01.png') no-repeat right top 20px, linear-gradient(106deg, #E3EEFF 0.44%, #BAD5FF 100%);background-size: contain;}
	.main_container .cont_mainVisual .item_02 { background: url('../images/main/visual_bg02.png') no-repeat right top 20px, linear-gradient(106deg, #E3FBFF 0.44%, #9DF0FF 100%);background-size: contain;}
	.main_container .cont_mainVisual .item_03 { background: url('../images/main/visual_bg03.png') no-repeat right top 20px, linear-gradient(106deg, #EDECFF 0.44%, #CCCDFF 100%);background-size: contain;}
	
	.main_container .cont_mainVisual .slide_controler{left:0px;bottom:10px;transform:translateX(0%);padding:5px 10px;border-radius:15px;background: none;}
	.main_container .cont_mainVisual .slide_controler .slide_nav .arrow{width:20px;height:20px;background-size:9px auto;}
	.main_container .cont_mainVisual .slide_controler .toggleButton{width:20px;height:20px;background-size:9px auto;}
	.main_container .cont_mainVisual .slide_controler .toggleButton.paused{background-size:8px auto;}

    .main_container .cont_service{position: relative;left:0;top:0;}
    .main_container .cont_service ul{flex-wrap: wrap;justify-content: space-between;}
    .main_container .cont_service .item{width: calc(25% - 8px);margin:0 0 24px 0;box-shadow:none;border-radius: 20px;background: #EFEFEF;}
    .main_container .cont_service .item::before{top:20px;width:45px;height:39px;margin-left:-20px;background-size:auto 39px;}
	.main_container .cont_service .item a{padding:15px 0;}
    .main_container .cont_service .item .txt{height:40px;margin:48px 0 0 0;font-size:14px;line-height:140%;}
  	.main_container .cont_service .item:hover{border: 2px solid #FFF;background:#E5EEF9;transform:none;}
	.main_container .cont_service .item:hover .txt{opacity:1;}
	.main_container .cont_service .item:hover .txt_rotate{opacity:0;}
	.main_container .cont_service .item .txt{opacity:1;}
	.main_container .cont_service .item .txt_rotate{opacity:0;}
	.main_container .cont_service .item_01:hover::before{background: url('../images/main/service_img01.png') no-repeat center center;background-size: auto 39px;}
	.main_container .cont_service .item_02:hover::before{background: url('../images/main/service_img02.png') no-repeat center center;background-size: auto 39px;}
	.main_container .cont_service .item_03:hover::before{background: url('../images/main/service_img03.png') no-repeat center center;background-size: auto 39px;}
	.main_container .cont_service .item_04:hover::before{background: url('../images/main/service_img04.png') no-repeat center center;background-size: auto 39px;}


    .main_container .cont_appDown{position: relative;left:0;right:auto;top:0;}
	.main_container .cont_appDown .app_down_box{display:flex;align-items:center;justify-content:center;width:100%;margin:0 auto;padding:12px 16px;border-radius:var(--border_radius_2);border: 1px solid #FFF;border: 1px solid #ABABAB;background: #FFF;box-shadow: none;}
	.main_container .cont_appDown .app_down_info{text-align:center;display:flex;flex-direction:column;align-items:center;}
    .main_container .cont_appDown .txt_01{margin:0 0 0 20px;font-size:20px;line-height:150%;}
    .main_container .cont_appDown .txt_02{display: none;}
	.main_container .cont_appDown .qr{display: none;}
    
	.main_container .section_03{background: #fff;}
    .main_container .section_03 .inner{flex-wrap: wrap;justify-content: normal;}
    .main_container .section_03 .part{border-radius:var(--border_radius_2);border: 1px solid #ABABAB;background: #FFF;box-shadow: none;}
    .main_container .section_03 .part_01{width:100%;height:100%;margin:0 0 24px 0;}
    .main_container .section_03 .part_02{width:calc(50% - 8px);height:232px;}
    .main_container .section_03 .part_03{width:calc(50% - 8px);height:232px;margin-left: auto;}

	.main_container .tit{font-size:20px;margin:0 0 10px 0;padding:0 0 10px 0;}
	.main_container .section_03 .part_01 .more{top:22px;}

	.main_container .article_area .tab_wrap button{font-size:20px;height:auto;padding:0 10px;}
	.main_container .article_area .tab_wrap button.btn_faq{display: none;}
	.main_container .cont_article .article_list li .date{font-size:14px;}
	.main_container .cont_faq .faq_list li a{font-size:14px;}

	.main_container .section_03 .part_01_type02{display: block;width: 100%;margin:0 0 24px 0;border-radius: 16px !important;background: #00B4C1;box-shadow: none;border: none;}
	.main_container .cont_faq_02 a{display: block;text-align: center; color: #FFF;font-size: 20px;font-weight: 600;line-height:140%;}
	.main_container .cont_faq_02 a span{display: inline-block; min-height:24px; padding:0 0 0 35px; background: url('../images/main/ico_question.png') no-repeat left center }

	.main_container .cont_promotional {height:155px;}
	.main_container .cont_utilizationApp{height:155px;}
	.main_container .cont_utilizationApp .thumbnail{padding:0 0 10px 0;}
	.main_container .cont_utilizationApp .thumbnail .logo img{width:63px;height:63px;border-radius: 16px;}
	.main_container .cont_utilizationApp .thumbnail .name{font-size:24px;}
	.main_container .cont_utilizationApp .explain{font-size:18px;height:80px;padding:0px 0;}

}

@media (max-width: 767px) {

	.main_container .cont_mainVisual .item_01,
	.main_container .cont_mainVisual .item_02,
	.main_container .cont_mainVisual .item_03 { background-size: auto 98px;background-position:right bottom;}
	.main_container .cont_mainVisual dl dd br{display: none;}

	.main_container .section_03 .inner{display: block;}
    .main_container .section_03 .part_02{width:100%;height:initial;margin: 0 0 10px 0;}
    .main_container .section_03 .part_03{width:100%;height:initial;margin-left:0;}

}

@media (max-width: 460px) {

	.main_container .inner{padding:0 12px 12px 12px;}

	.main_container .cont_mainVisual dl dt{font-size:28px;}
	.main_container .cont_mainVisual dl dd{font-size: 16px;}

	.main_container .cont_service .item{width:calc(50% - 5px);margin:0 0 12px 0;}
	.main_container .section_03 .part_01{margin:0 0 12px 0;}

}
