@charset "UTF-8";
.container-fluid { padding-bottom:0; }
.c-content { font-family: YakuHanJPs,"Noto Sans JP",sans-serif;color: #000;}
.c-content img { max-width:100%;height:auto;vertical-align:bottom; }
sup,sub { font-size:66%; }
.main_visual_bg{background:url(/fa/topics/2024/01_mailab/assets/img/img_main_bg2.jpg) no-repeat top center;background-size: 100% 100%;}
.main_visual{position: relative;background:url(/fa/topics/2024/01_mailab/assets/img/img_main_bg.jpg) no-repeat top center;background-size: cover;padding: 26px 0 48px;max-width: 1442px;margin: 0 auto;}
.main_lead{font-size: 414.286%;font-weight: 900;color: #003c89;margin-left: 5%;line-height: 1.362;}
.main_lead .txt_01{display: inline-block;font-size: 172.414%;color: #0097d9;line-height: 1;margin-left: -5px;margin-top:6px;letter-spacing: -0.05em;}
.main_lead .txt_02{display: inline-block;font-size: 72.4136%;line-height:1.05 ;}
.main_lead .txt_small{font-size: 56%;color: #003c89;}
.main_image{width: 40.428%;position: absolute;  top: 52.5%;right: -17.5%;transform: translate(-50%, -50%);}
.main_text_block{margin-top: 36px;}
.product_list{width: 70%;display: flex;margin-top: 73px;margin-left: -14px;}
.product_list li{width: 24.665%;position: relative;font-size: 200%;font-weight: bold;text-align: center;color: #fff;line-height: 1.319;}
.product_list li span{width: 100%;position: absolute;left: 50%;top: 49%;transform: translate(-50%, -50%);}
.product_list li:nth-child(2){left: -4%;top: -19px;}
.product_list li:nth-child(3){left: -8%;}
.product_list li:nth-child(4){left: -12%;top: -20px;}

.main_text{font-size: 185.714%;font-weight: bold;text-align: center;font-family: 'メイリオ';}
.main_title{text-align: center;margin-top: 3px;}
.main_btn.download_btn{text-align: center;margin-top: 15px;}

.trouble_sec{text-align: center;padding: 93px 0 74px;}
.title_trouble{font-size: 357.143%;font-weight: bold;color: #0099d9;}
.trouble_list{display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 48px;}
.trouble_list li{display: flex;align-items: center;justify-content: center;width: 31.625%;min-height: 179px;padding: 24px 20px 28px;font-size:200%;font-weight: bold;background-color: #0099d9;border-radius: 5px;color: #fff;letter-spacing: -0.05em;}
.trouble_list li em.color_txt{color: #f7ec13;}
.trouble_list li:nth-of-type(4){margin-left: 0;}
.trouble_list li:nth-of-type(n+4){margin-top: 38px;}
.arrow_down{margin-top: 70px;}

.tool_sec{text-align: center;background-color: #d9e6f1;padding: 104px 0 77px;}
.tip{width: 149px;margin: 0 auto;text-align: center;position: relative;}
.tip .inner_text{width: 100%;font-size: 285.714%;position: absolute;left: 50%;transform: translate(-50%,-50%);top: 50%;color: #fff;}
.tool_text{font-size: 257.143%;font-weight: bold;color: #0099d9;margin-top: 34px;}
.data_text{font-size: 328.571%;font-weight: bold;margin-top: 24px;letter-spacing: 0.04em;}
.data_text+.tool_text{margin-top: 20px;}
.text_example{font-size: 285.714%;font-weight: bold;margin-top: 53px;}
.tool_sec .arrow_down{margin-top: 26px;}

.problem_sec{padding: 125px 0 150px;}
.inner_sec+.inner_sec{margin-top: 116px;}
.inner_sec.graph{margin-top: 120px;}
.inner_sec.search{margin-top: 109px;}
.title_problem_block{display: flex;align-items: center;}
.title_img{margin-top: 9px;width: 8.633%;margin-left: 3px;z-index: 1}
.inner_sec.setting .title_img{margin-top: -2px;width: 8.89%;margin-left: 0;}
.inner_sec.graph .title_img{margin-top: -3px;width: 9.06%;}
.inner_sec.search .title_img{margin-top: 12px;margin-left: 5px;width: 7.864%;}
.title_problem{background-color: #005aa1;color: #fff;font-size: 328.5712%;padding: 6px 0 7px 53px;width: 88.804%;position: relative;margin-left: 9px;}
.inner_sec.setting .title_problem{margin-left: 7px;}
.inner_sec.graph .title_problem{margin-left: 4px;padding-left: 49px;}
.inner_sec.search .title_problem{margin-left: 16px;}
.title_problem span:before,.title_problem span:after{content: "";display: inline-block;position: absolute;}
.title_problem span:before{width: 4%;height: 100%;background-color: #fff;border-radius: 50%;left: 0;top:50%;transform: translate(-53%, -50%);}
.title_problem span:after{width: 4%;height: 100%;background-color: #005aa1;border-radius: 50%;right: 0;top:50%;transform: translate(50%, -50%);}
.problem_wrap{display: flex;justify-content: space-between;background-color: #e5eef6;padding: 15px 28px 35px 0;margin-top: 9px;border-radius: 8px;margin-left: 0;width: 100%;}
.inner_sec.setting .problem_wrap{margin-top: 22px;padding-top: 17px;}
.inner_sec.graph .problem_wrap{margin-top: 19px;padding-top: 17px;}
.inner_sec.search .problem_wrap{margin-top: 20px;padding-top: 14px;padding-bottom: 36px;}
.problem_text_block{width: 39%;}
.problem_img_block{width: 59.701%;padding-top: 84px;}
.inner_sec.setting .problem_img_block{width: 57.408%;}
.subttl_problem{font-size: 300%;font-weight: 900;color: #005aa1;display: flex;align-items: center;}
.subttl_problem img{vertical-align: -4px;margin-right: 2.94%;}
.inner_text_block{padding-left: 30px;margin-top: 23px;width: 95.2%;}
.inner_sec.search .inner_text_block{margin-top: 20px;}
.inner_sec.setting .inner_text_block{margin-top: 24px;}
.inner_sec.setting .inner_text_block .after_text+.problem_text{letter-spacing: -0.12em;}
.problem_text{font-size: 200%;font-weight: 600;margin-top: 18px;line-height: 1.6;letter-spacing: -0.07em;}
.inner_sec.search .problem_text{letter-spacing: -0.129em;}
.before_text{background-color: #7dabcf;text-align: center;border-radius: 20px;color: #fff;font-size: 185.714%;font-weight: 900;}
.before_text span,.after_text span{font-size: 84.6156%;}
.bg_arw{text-align: center;margin-top: 10px;}
.after_text{background-color: #3d82b7;text-align: center;border-radius: 20px;color: #fff;font-size: 185.714%;font-weight: 900;margin-top: 16px;}
.problem_sec .problem_lead_text{font-size: 242.857%;font-weight: bold;color: #0099d9;margin: 72px 0 0;text-align: center;}
.problem_sec .download_btn{margin-top: 20px;}
.indent{margin: 0 -5.3%;}
.problem_text .indent{margin: 0 -0.9%;}

.solving_sec{background-color: #d9e6f1;text-align: center;padding: 93px 0 64px;}
.solving_sec .title_solving{font-size: 257.143%;font-weight: bold;color: #0099d9;margin: 0 0 30px;text-align: center;}
.solving_sec .arrow_down{margin-top: 38px;}
.solving_sec .software_block{display: flex;flex-direction: row-reverse;position: relative;margin-left: 14px;margin-right: 222px;margin-top: -22px;}
.solving_txt_block{width: 47%;position: absolute;top: 39.5%;left: 45%;transform: translate(-50%,-50%);}
.solving_sec .img_people{width: 33.941%;position: relative;top: 4px;}
.solving_sec .software_block .solving_txt{position: relative;background-color: #0099d9;padding: 7.96% 20px 7.8% 20%;color: #fff;font-size: 200%;font-weight: bold;line-height: 1.61;border-radius: 6px;text-align: left;letter-spacing: -0.05em;}
.solving_sec .software_block .solving_txt:after{position: absolute;content: '';display: block;background: url(../img/arw_after.png) no-repeat;width: 102px;height: 36px;right: -22.5%;top: 44%;}
.solving_sec .software_block .solving_txt .color_txt{font-size: 114.2856%;color: #ffff00;}

.mailab_analysis_sec{padding: 142px 0 100px;}
.title_bg{font-size: 300%;text-align: center;font-weight: bold;background-color: #005aa1;color: #fff;border-radius: 8px;padding: 11px 0;letter-spacing: -0.06em;}
.mailab_analysis_wrap{margin-top: 52px;}
.title_border{font-size: 242.857%;text-align: center;color: #0099d9;padding-bottom: 8px;margin-bottom:30px;border-bottom: 6px solid #0099d9;display: flex;justify-content: center;align-items: end;}
.title_border img{width: 9.558%;}
.title_border .title_border_block{margin-left: 6.2%;display: flex;align-items: center;width: 100%}
.title_border .title_border_block span.circle_text{position: relative;font-size: 152.5%;display: flex;align-items: center;justify-content: center;color: #fff;background-color: #0099d9;border-radius: 50%;width: 86px;height: 87px;text-align: center;}
.title_border .title_border_block span.circle_text:after{content: '';display: inline-block;position: absolute;background: url(../img/arr.png) no-repeat center;background-size: 100% auto;width: 40px;height: 20px;top: 62%;right: -23px;transform: translateY(-50%);}
.title_border .title_border_block span.analysis_text{display: inline-block;text-align: left;width: 90%;margin-top: 28px;margin-left: 22px;letter-spacing: -0.04em;}
.mailab_analysis_wrap + .mailab_analysis_wrap .title_border .title_border_block{margin-left: 6.2%;}
.mailab_analysis_wrap + .mailab_analysis_wrap .title_border .title_border_block span.analysis_text{margin-left: 30px;margin-top: 28px;} 
.mailab_analysis_bg{text-align: center;background-color: #e5eef6;border-radius: 8px;padding: 30px 20px 62px;}
.mailab_analysis_wrap + .mailab_analysis_wrap{margin-top: 50px;}
.mailab_analysis_wrap + .mailab_analysis_wrap .title_border{margin-bottom: 36px;}
.mailab_analysis_wrap + .mailab_analysis_wrap .mailab_analysis_bg{padding: 41px 20px 40px;}
.analysi_img{position: relative;left: 13px;}
.ai_img{margin-top: 27px;position: relative;left: 16px;}
.analysi_lead_text{font-size: 200%;font-weight: 600;color: #333;line-height: 1.71425;margin-top: 5px;letter-spacing: -0.05em;}
.mailab_analysis_wrap + .mailab_analysis_wrap .mailab_analysis_bg .analysi_lead_text{line-height: normal;margin-bottom: 14px;margin-top: 0px;}
.support_sec{text-align: center;margin-top: 100px;}
.support_sec .title_bg{padding: 12px 0 11px;}
.support_wrap + .support_wrap{margin-top: 44px;}
.support_wrap{border: 4px solid #0099d9;border-radius: 8px;margin-top: 58px;padding: 19px 10px 24px;box-sizing: border-box;}
.support_title{font-size: 242.857%;color: #0099d9;letter-spacing: -0.05em;line-height: 1.411766;}
.support_sec p{font-size: 200%;font-weight: 600;color: #333;margin-top: 7px;letter-spacing: -0.07em;}
.support_sec .support_lead_text{font-size: 242.857%;font-weight: bold;color: #0099d9;margin: 54px 0 13px;line-height: 1.735;}
.support_sec .support_lead_text + img{position: relative;left: 5px;}
.support_sec .note_text{font-size: 157.143%;font-weight: 600;margin-top: 12px;}
.support_wrap + p{margin-top: 22px;}
.download_btn{margin-top: 14px;text-align: center;}

@media only screen and (min-width:768px) and (max-width:1230px){
.c-content { font-size:1.138vw; }
.ai_img{left: 0;}
.analysi_img{left: 0;}
.main_image {top: 50.85%;}
.product_list li{font-size: 2vw;}
.product_list{width: 68%;}
.solving_sec .software_block{margin-right: 11vw;}
.problem_text_block{width: 44vw;}
.subttl_problem {font-size: 3.0746vw;}
.title_border .title_border_block{margin-left: 5vw!important;}
.title_border .title_border_block span.analysis_text{margin-left: 30px;}
.title_border{font-size:2.48902vw;}
.title_border .title_border_block span.circle_text{width: 70px;height: 69px;}
.title_border .title_border_block span.analysis_text{margin-top: 20px!important;}
}

@media only screen and (min-width:768px) and (max-width:1400px)
{

}

@media (min-width:768px) {
.sp_only { display:none !important; }
}


@media only screen and (max-width:767px){
.pc_only { display:none !important; }
.dl_link:hover { opacity:1; }
.main_visual_bg{background: none;}
.main_visual{max-width: 100%;background: url(/fa/topics/2024/01_mailab/assets/img/img_main_bg_sp.jpg) no-repeat top center;background-size: cover;padding: 25px 20px 138px 19px;}
.main_lead{font-size: 180.97%;margin-left: 8px;line-height: 1.42;}
.main_lead .txt_01{display: block;font-size:175.989%;letter-spacing: normal;margin-left: 0;margin-top: 3px;margin-bottom: 9px;}
.main_lead .txt_02{font-size: 75.997%;}
.main_text_block{position: absolute;left: 50%;transform: translateX(-50%);width: 100%;margin-top: 5px;padding:0 10px ;}
.main_visual .l-inner--large{padding-left: 0;padding-right: 0;}
.product_list{width: 100%;position: relative;margin-left: -7px;margin-right: -12px;margin-top: 17px;}
.product_list li{width: 25%;font-size: 101.339%;left: inherit !important;}
.product_list li span{left: 58%;}
.product_list li:nth-child(2n){top: -10px;}
.product_list li img{width: 115%;max-width: 202px;}
.main_image{width: 62.987%;margin-left: 60px;margin-top: 0;position: inherit;transform: inherit;}
.main_text{font-size: 94.1003%;margin-bottom: -3px;}
.main_title{margin-top: 3px;}
.main_title img{max-width: 280px;width: 100%;}
.main_btn.download_btn{margin-top: 11px;margin-bottom: 2px;}
.main_btn.download_btn img{max-width: 342px;width: 100%;}
.c-content .tool_sec img.arrow_down{margin-top: 12px;}
.title_trouble{font-size: 130.293%;letter-spacing: -0.05em;}
.title_bg{font-size: 144.77%;padding: 10px 6px 9px;;line-height: 1.285em;border-radius: 4px;}
.title_problem{font-size: 137.532%;min-height: 68px;display: flex;align-items: center;padding: 3px 0 5px 24px;width: 79%;margin-left: 5px;}
.inner_sec.setting .title_problem{margin-left:6px ;}
.inner_sec.graph .title_problem {margin-left: 2px;}
.inner_sec.graph .title_problem{padding-left: 24px;}
.inner_sec.search .title_problem {margin-left: 5px;padding: 3px 0 7px 24px;}
.title_problem span:before{width: 6%;}
.title_problem span:after{width: 10%;}
.subttl_problem{font-size: 144.77%;}
.problem_wrap{display: block;padding: 10px 0 15px 0;margin-left: 0;margin-top: 17px;}
.inner_sec.graph .problem_wrap {margin-top: 17px;padding-top: 8px;}
.problem_text_block {width: 100%;}
.problem_text_block {width: 100%;}
.inner_text_block {width: 100%;padding-left: 12px;padding-right: 12px;margin-top: 12px;}
.inner_sec.search .inner_text_block {margin-top: 10px;}
.inner_sec.setting .inner_text_block {margin-top: 12px;}
.before_text{font-size: 94.1003%;}
.after_text{font-size: 94.1003%;margin-top: 5px;}
.inner_sec.search .problem_text{letter-spacing: normal;margin-top: 10px;}
.problem_text{font-size: 101.339%;margin-top: 9px;}
.problem_img_block {width: 100%;padding: 10px 11px 0;}
.problem_img_block img{width: 100%;}
.inner_sec.setting .problem_img_block {width: 100%;}
.inner_sec.graph .problem_img_block {width: 100%;padding: 12px 11px 0;}
.inner_sec.search .problem_img_block{padding: 9px 11px 0;}
.trouble_sec{padding: 36px 0 32px;}
.trouble_list{margin-top:16px;padding: 0 12px;justify-content: inherit;}
.trouble_list li{width: 47.667%;min-height: 74px;padding: 10px;font-size: 86.862%;margin-top: 0;border-radius: 3px;}
.trouble_list li+li{margin-left: 0;}
.trouble_list li:nth-of-type(n+3){margin-top: 14px;}
.trouble_list li:nth-child(2n){margin-left: 4.05%;}
.c-content img.arrow_down {margin-top: 20px;max-width: 77px;width: 100%;}

.tool_sec{padding: 42px 0 30px;}
.tool_sec .tip{width: 74px;}
.tool_text{font-size: 123.055%;line-height: 1.70587;margin-top: 20px;}
.data_text{font-size: 166.486%;margin-top: 10px;}
.data_text+.tool_text{margin-top: 12px;}
.text_example{font-size: 144.77%;margin-top: 26px;}
.tip .inner_text{font-size: 137.532%;}
.problem_sec {padding: 58px 0 72px;}
.subttl_problem img{max-width: 60px;width: 100%;}
.bg_arw{margin-top: -1px;}
.bg_arw img{max-width: 34px;width: 100%;}
.inner_sec.setting .bg_arw{margin-top: 0;}
.inner_sec.graph .bg_arw{margin-top: 0;}
.inner_sec+.inner_sec {margin-top: 48px;}
.inner_sec.graph{margin-top: 48px;}
.inner_sec.search .problem_wrap{padding-bottom: 15px;padding-top: 8px;margin-top: 18px;}
.title_img{width: 15%;margin-left: 0;}
.problem_sec .problem_lead_text {font-size: 115.816%;margin: 29px 0 0;letter-spacing: -0.05em;}
.problem_sec .download_btn {margin-top: 14px;}
.solving_sec{padding: 28px 0 30px;}
.solving_sec .title_solving {font-size: 123.054%;margin: 0 0 11px;letter-spacing: -0.05em}
.solving_sec .software_block{margin-left: 0;margin-right: 0;margin-top: 12px;}
.c-content .solving_sec .arrow_down{display: block;margin: 9px auto 0;}
.mailab_analysis_sec {padding: 44px 0 22px;}
.solving_sec .software_block .solving_txt{font-size: 100%;padding: 15px 20px 12px 38px;border-radius: 3px;}
.solving_txt_block{width: 61.6%;top: 8px;left: 10px;transform: inherit;}
.solving_sec .img_people{width: 47.25%;top: -6px;right: -5px;}
.solving_sec .software_block .solving_txt:after{background: none;  width: 0px;height: 0px;border-style: solid;border-width: 6px 0 6px 35px;border-color: transparent transparent transparent #0099d9;transform: rotate(0deg);right: -33px;top:38px ;}
.analysi_lead_text{font-size: 101.339%;margin-top: 14px;}
.mailab_analysis_wrap {margin-top: 22px;margin-bottom: 12px;}
.title_border{font-size: 123.055%;padding-bottom: 6px;margin-bottom: 11px;border-bottom: 3px solid #0099d9;align-items: center;}
.title_border img{max-width: 53.5px;width: 100%}
.title_border .title_border_block,
.mailab_analysis_wrap + .mailab_analysis_wrap .title_border .title_border_block{margin-left: 8px;display: flex;align-items: center;}

.title_border .title_border_block span.circle_text{width: 44px;height:43px;font-size:152.94% ;}
.title_border .title_border_block span.circle_text:after{width: 20px;height: 10px;top: 60%;right: -10px;}
.title_border .title_border_block span.analysis_text{width: 79%;margin-left: 5%;margin-bottom: 0;margin-top: 0;}
.mailab_analysis_wrap + .mailab_analysis_wrap .title_border .title_border_block span.analysis_text {margin-left: 5%;margin-top: 0;}
.mailab_analysis_wrap + .mailab_analysis_wrap .mailab_analysis_bg .analysi_lead_text{margin-top: 0;margin-bottom: 9px;line-height: 1.73;}
.support_title{font-size: 123.055%;}
.support_sec p{font-size: 101.339%;margin-top: 3px;}
.support_sec .support_lead_text{font-size: 123.055%;margin: 28px 0 9px;line-height: 1.58823;}
.support_sec .support_lead_text + img {max-width: 78px;left: 0px;margin-top: 8px;width: 100%;}
.inner_sec.setting .title_img{width: 15%;margin-top: -2px;margin-left: 0;}
.inner_sec.setting .problem_wrap {margin-top: 16px;padding-top: 9px;}
.inner_sec.graph .title_img{width: 16%;margin-top: 2px;}
.inner_sec.search .title_img{width: 13%;margin-top: 0;margin-left: 8px;}
.support_wrap + p {margin-top: 15px;}
.support_wrap + .support_wrap {margin-top: 17px;}
.support_wrap {border: 2px solid #0099d9;margin-top: 24px;padding:10px 10px 15px;border-radius: 4px;}
.support_sec .title_bg {padding: 6px 0;}
.support_sec {margin-top: 48px;}
.support_sec .note_text {font-size: 79.6233%;margin-top: 8px;}
.mailab_analysis_wrap + .mailab_analysis_wrap {margin-top: 26px;}
.mailab_analysis_wrap + .mailab_analysis_wrap .title_border {margin-bottom: 12px;padding-bottom: 6px;}
.mailab_analysis_wrap + .mailab_analysis_wrap .title_border span.analysis_text{width: 79%;}
.mailab_analysis_bg{padding: 14px 10px 18px;border-radius: 4px;}
.analysi_img {left: 0;}
.ai_img{margin-top: 12px;left: 0;}
.mailab_analysis_wrap + .mailab_analysis_wrap .mailab_analysis_bg {padding: 15px 12px 18px;}
.download_btn{margin-top: 10px;}
.download_btn img{max-width: 352px; width: 100%;}
.support_sec .download_btn{margin-top: 13px;}
.indent{margin: 0;}
}
@media only screen and (max-width:375px){
.c-content { font-size:3.684vw; }
}
@media only screen and (max-width:320px){
.product_list li{font-size: 90%;}
}