@charset "UTF-8";

:root {
  --main-color-navy: #1808A4;
}

#main .contents .contents_title .contents_title_en{color:var(--main-color-navy);}
#main .contents .contents_title .contents_title_jp:before {border-bottom-color:var(--main-color-navy);}
#main .sub_title{color:var(--main-color-navy);}
#main p.en{color:var(--main-color-navy);}

#main .manual_supporte .main_pic{margin: 0 0 90px;}
#main .manual_supporte .main_pic img{width:100%;height:auto;}

#main .manual_supporte ul{display:flex;margin:0 0 50px;}
#main .manual_supporte ul li{width:100%;display:flex;text-align:left;}
#main .manual_supporte ul li:first-child{width:100px;margin:0 40px 0 0;}
#main .manual_supporte ul li img{width:100%;height:auto;}
#main .manual_supporte ul li .tex_block .title{font-size:24px;line-height:1.6;font-weight:700;margin:0 0 10px;color:var(--main-color-navy);}
#main .manual_supporte ul li .tex_block .tex{font-size:20px;line-height:1.6;}

#main .manual_supporte .service{display:flex;}
#main .manual_supporte .service .text{width:100%;flex:1;text-align:left;}
#main .manual_supporte .service .text .title{font-size:24px;line-height:1.6;font-weight:700;color:var(--main-color-navy);margin:0 0 40px;}
#main .manual_supporte .service .text .tex {font-size:20px;line-height:1.6;margin:0 0 40px;}
#main .manual_supporte .service .pic{width:460px;margin-left:60px;}
#main .manual_supporte .service .pic img{width:100%;height:auto;}

#main .manual_supporte .manual_supporte_btn a{font-size:13px;line-height:44px;color:#FFF;text-align:left;text-decoration:none;letter-spacing:0.1em;display:block;background-color:var(--main-color-navy);height:48px;width:164px;box-sizing:border-box;border:solid 2px var(--main-color-navy);border-radius:50px;position:relative;transition:color .3s, background-color .3s;}
@media screen and (min-width: 768px) {
  #main .manual_supporte .manual_supporte_btn a:hover{color:var(--main-color-navy);background:none;}
}
#main .manual_supporte .manual_supporte_btn a span{margin-left:20px;}
#main .manual_supporte .manual_supporte_btn a span::after{content:"";display:block;width:24px;height:24px;background:url("../images/service/btn_icon.svg") no-repeat 0 0;background-size:contain;transition:background-image .3s;position:absolute;right:15px;top:50%;transform:translateY(-50%);}
@media screen and (min-width: 768px) {
  #main .manual_supporte .manual_supporte_btn a:hover span::after{background-image:url("../images/service/btn_icon_over.svg");}
}

@media (max-width: 1280px) {
  #main .manual_supporte .main_pic{margin:0 0 7.03vw;}

  #main .manual_supporte ul{margin:0 0 3.90vw;}
  #main .manual_supporte ul li:first-child{width:7.812vw;margin:0 3.125vw 0 0;}
  #main .manual_supporte ul li .tex_block .title{font-size:1.87vw;margin:0 0 0.781vw;}
  #main .manual_supporte ul li .tex_block .tex {font-size:1.562vw;}

  #main .manual_supporte .service .text .title{font-size:1.87vw;margin:0 0 3.125vw; }
  #main .manual_supporte .service .text .tex{font-size:1.562vw;margin:0 0 3.125vw;}
  #main .manual_supporte .service .pic{width:35.93vw;margin-left:4.687vw;}

  #main .manual_supporte .manual_supporte_btn a{font-size:1.015vw;line-height:3.437vw;height:3.75vw;width:12.812vw;border-width:0.156vw;}
  #main .manual_supporte .manual_supporte_btn a span{margin-left:1.262vw;}
  #main .manual_supporte .manual_supporte_btn a span::after{width:1.875vw;height:1.875vw;right:1.171vw;}
}

@media screen and (max-width: 767px) {
  #main .manual_supporte .main_pic{margin:0 0 30px;}

  #main .manual_supporte ul{display:block;margin:0 0 30px;}
  #main .manual_supporte ul li{display:block;}
  #main .manual_supporte ul li:first-child{width:54px;margin:0 auto 10px;}
  #main .manual_supporte ul li .tex_block .title{font-size:12px;font-weight:500;margin:0;}
  #main .manual_supporte ul li .tex_block .tex{font-size:12px;}

  #main .manual_supporte .service{display:block;}
  #main .manual_supporte .service .text{width: 100%;margin: 0 0 30px;}
  #main .manual_supporte .service .text .title{font-size:12px;font-weight:500;margin:0;}
  #main .manual_supporte .service .text .tex{font-size:12px;margin:0 0 20px;}
  #main .manual_supporte .service .pic{width:100%;max-width:272px;margin:0 auto;}
  
  #main .manual_supporte .manual_supporte_btn a{font-size:11px;line-height:34px;height:34px;width:130px;border:none;}
  #main .manual_supporte .manual_supporte_btn a span{margin-left:15px;}
  #main .manual_supporte .manual_supporte_btn a span::after{width:18px;height:18px;right:12px;}
}
