@charset "utf-8";
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,
abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,d,footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video { margin:0; padding:0; border:0; outline:0; vertical-align:bottom; background:transparent;}
body { line-height:1; -webkit-text-size-adjust: 100%;}
ul li { list-style:none;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none;}

a { margin:0; padding:0; color: #666; text-decoration: none; vertical-align:baseline;}
a:hover { opacity: 0.7;}
del { text-decoration: line-through;}
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help;}
table { border-collapse:collapse; border-spacing:0;}
hr { display:block; height:1px; border:0;  border-top:1px solid #cccccc; margin:1em 0; padding:0;}
input, select { vertical-align:middle;}
/* ===================================================================================
  resetここまで
=================================================================================== */
body * {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #000;
	font-size: 18px;
}

.pc_none { display: none;}

header {
  background: #fff;
  border-bottom: solid 3px #f75a1f;
}
.sec01 { background: url("https://www.kpnet.jp/wp-content/themes/liquid-lp/images/pc_bg01.jpg") no-repeat top center;}
.sec02 { background: url("https://www.kpnet.jp/wp-content/themes/liquid-lp/images/pc_bg02.jpg") no-repeat top center;}
.sec03 { background: url("https://www.kpnet.jp/wp-content/themes/liquid-lp/images/pc_bg03.jpg") no-repeat top center;}
.sec04 { background: url("https://www.kpnet.jp/wp-content/themes/liquid-lp/images/pc_bg04.jpg") no-repeat top center;}
.sec05 { background: url("https://www.kpnet.jp/wp-content/themes/liquid-lp/images/pc_bg05.jpg") no-repeat top center;}
.sec06 { background: url("https://www.kpnet.jp/wp-content/themes/liquid-lp/images/pc_bg06.jpg") no-repeat top center;}
.cta { background: #f75a1f;}

.inner { width: 1050px; margin: 0 auto;}


header .inner {
  display: flex;
  padding: 20px 0 15px;
}
header h1 {
  margin-left: 25px;
  margin-right: 84px;
}
header h1 img { width: 239px;}

header .tel_area .text {
  font-size: 14px;
  margin-bottom: 5px;
}
header .tel_area .tel a {
  display: block;
  font-size: 38px;
  line-height: 1;
  font-family: 'arial black',sans-serif;
  letter-spacing: 0;
  padding-left: 58px;
  position: relative;
}
header .tel_area .tel a::before {
  content: "";
  display: block;
  width: 52px;
  height: 30px;
  background: url("../images/pc_head_tel.png") no-repeat center/100%;
  position: absolute;
  left: 2px;
  top: 6px;
}
header .btn { margin-left: 13px;}
header .btn a {
  display: block;
  filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.2));
}

.cta .inner {
  display: flex;
  align-items: center;
  padding: 20px 0 20px;
}
.cta .tel_area { margin-left: 25px;}
.cta .tel_area .text {
  color: #fff;
  font-size: 19px;
  font-weight: bold;
  margin-left: 13px;
  margin-bottom: 5px;
}
.cta .tel_area .tel a {
  display: block;
  color: #ffff00;
  font-size: 55px;
  line-height: 1;
  font-family: 'arial black',sans-serif;
  letter-spacing: 0;
  padding-left: 85px;
  position: relative;
}
.cta .tel_area .tel a::before {
  content: "";
  display: block;
  width: 72px;
  height: 40px;
  background: url("../images/img_cta_tel.png") no-repeat center/100%;
  position: absolute;
  left: 9px;
  top: 9px;
}
.cta .tel_area .time {
  color: #fff;
  font-size: 14px;
  margin-top: 15px;
}
.cta .btn { margin-left: 35px;}
.cta .btn a {
  display: block;
  filter: drop-shadow(3px 3px 3px rgba(0,0,0,0.2));
}




@media screen and (min-width:768px) and ( max-width: 1050px) {
  body * { font-size: 1.7vw;}
  img { width: 100%;}
  
  header { border-bottom: solid 0.3vw #f75a1f;}
  .sec01 { background: url("../images/pc_bg01.jpg") no-repeat top center/190.5vw auto;}
  .sec02 { background: url("../images/pc_bg02.jpg") no-repeat top center/190.5vw auto;}
  .sec03 { background: url("../images/pc_bg03.jpg") no-repeat top center/190.5vw auto;}
  .sec04 { background: url("../images/pc_bg04.jpg") no-repeat top center/190.5vw auto;}
  .sec05 { background: url("../images/pc_bg05.jpg") no-repeat top center/190.5vw auto;}
  .sec06 { background: url("../images/pc_bg06.jpg") no-repeat top center/190.5vw auto;}

  .inner { width: 100vw; margin: 0 auto;}


  header .inner { padding: 1.9vw 0 1.4vw;}
  header h1 {
    margin-left: 2.4vw;
    margin-right: 8vw;
  }
  header h1 img { width: 22.8vw;}

  header .tel_area .text {
    font-size: 1.3vw;
    margin-bottom: 0.5vw;
  }
  header .tel_area .tel a {
    font-size: 3.8vw;
    padding-left: 5.5vw;
  }
  header .tel_area .tel a::before {
    width: 5vw;
    height: 2.9vw;
    left: 0.2vw;
    top: 0.6vw;
  }
  header .btn { margin-left: 1.2vw;}
  header .btn a { filter: drop-shadow(0.2vw 0.2vw 0.2vw rgba(0,0,0,0.2));}
  header .btn a img { width: 30.1vw;}

  .cta .inner { padding: 1.9vw 0 1.9vw;}
  .cta .tel_area { margin-left: 2.4vw;}
  .cta .tel_area .text {
    font-size: 1.8vw;
    margin-left: 1.2vw;
    margin-bottom: 0.5vw;
  }
  .cta .tel_area .tel a {
    font-size: 5.2vw;
    padding-left: 8.1vw;
  }
  .cta .tel_area .tel a::before {
    width: 6.9vw;
    height: 3.8vw;
    left: 0.9vw;
    top: 0.9vw;
  }
  .cta .tel_area .time {
    font-size: 1.3vw;
    margin-top: 1.4vw;
  }
  .cta .btn { margin-left: 3.3vw;}
  .cta .btn a { filter: drop-shadow(0.3vw 0.3vw 0.3vw rgba(0,0,0,0.2));}
  .cta .btn a img { width: 44.5vw;}
}





.sec02 .text1 {
  font-size: 38px;
  font-weight: bold;
  line-height: 1.52;
  text-align: center;
}
.sec02 .text1 strong {
  color: #f75a1f;
  font-size: 38px;
  font-weight: bold;
  line-height: 1.52;
}
.sec02 .text1 span {
  font-size: 38px;
  font-weight: bold;
  line-height: 1.52;
}
.sec02 .text1 .line {
  font-size: 38px;
  font-weight: bold;
  line-height: 1.52;
  background: linear-gradient(transparent 75%, transparent 0, #fdf258 25%, #fdf258 0);
  background-position: 0px -7px;
}
.sec02 .text2 {
  line-height: 1.77;
  text-align: center;
  margin-top: 55px;
  margin-bottom: 95px;
}
.sec02 .text2 strong { color: #003e91;}

.sec02 .example_area {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto;
}
.sec02 .example_area .example {
  width: 498px;
  height: 348px;
  background: url("../images/bg_example.png")no-repeat 0 0/100%;
  filter: drop-shadow(15px 15px 15px rgba(0,0,0,0.3));
  position: relative;
}
.sec02 .example_area .example::before {
  content: "";
  display: block;
  width: 58px;
  height: 64px;
  background: url("../images/pc_example_arrow.png")no-repeat 0 0/100%;
  position: absolute;
  top: 142px;
  right: -33px;
}

.sec02 .example_list {
  margin-top: 20px;
  margin-left: 30px;
}
.sec02 .example_list li {
  display: flex;
  align-items: center;
  position: relative;
  padding-left: 38px;
  margin-bottom: 11px;
}
.sec02 .example_list li::before {
  content: "";
  display: block;
  width: 28px;
  height: 28px;
  background: url("../images/icon_check.png")no-repeat center/100%;
  position: absolute;
  left: 0;
  top: 0;
}
.sec02 .example_list li .line {
  display: block;
  height: 3px;
  background-image: linear-gradient(to right, #b3b3b3, #b3b3b3 3px, transparent 2px, transparent 5px);
  background-size: 9px 3px;
  background-position: top;
  background-repeat: repeat-x;
  margin: 0 15px 0 10px;
}
.sec02 .example_list li.c01 .line { width: 125px;}
.sec02 .example_list li.c02 .line { width: 125px;}
.sec02 .example_list li.c03 .line { width: 88px;}
.sec02 .example_list li.c04 .line { width: 161px;}
.sec02 .example_list li strong {
  color: #003e91;
  font-size: 30px;
} 
.sec02 .example_list li strong span {
  color: #003e91;
  font-size: 24px;
}
.sec02 .example_list li .etc {
  font-size: 16px;
  margin-top: 10px;
  margin-left: 10px;
}

.sec02 .ad_list {
  display: flex;
  justify-content: center;
  padding-bottom: 75px;
}
.sec02 .ad_list li {
  font-size: 28px;
  font-weight: bold;
  line-height: 1.35;
  text-align: center;
}
.sec02 .ad_list li:nth-child(2) { margin: 0 80px 0 60px;}



.sec03 .rs_list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 1030px;
  margin: 0 auto;
}
.sec03 .rs_list .reason_box {
  position: relative;
  margin-bottom: 240px;
}
.sec03 .rs_list .reason_box .rs_text {
  width: 420px;
  height: 260px;
  margin: 0 auto;
  background: #fff;
  box-shadow: 10px 10px 10px rgba(0,0,0,0.3);
  position: absolute;
  bottom: -208px;
  left: 0;
  right: 0;
}
.sec03 .rs_list .reason_box .rs_text h2 {
  font-size: 29px;
  text-align: center;
  line-height: 1.31;
  padding: 30px 0 20px;
}
.sec03 .rs_list .reason_box .rs_text h2.two { line-height: 74px;}
.sec03 .rs_list .reason_box .rs_text h2 strong {
  color: #f75a1f;
  font-size: 29px;
}
.sec03 .rs_list .reason_box .rs_text p {
  font-size: 16px;
  line-height: 1.75;
  text-align: justify;
  width: 364px;
  margin: 0 auto;
}
.sec03 .rs_list .reason_box .rs_text p strong {
  font-size: 16px;
  line-height: 1.75;
}

.sec03 .dakara {
  color: #fff;
  font-size: 37px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 2px;
}

.sec03 .img04 {
  margin: 112px 0 0;
  padding-bottom: 210px;
  position: relative;
}
.sec03 .img04 .text {
  font-size: 37px;
  font-weight: bold;
  letter-spacing: 2px;
  position: absolute;
  top: 135px;
  left: 257px;
}



@media screen and (min-width:768px) and ( max-width: 1050px) {
  .sec02 .text1 { font-size: 3.6vw;}
  .sec02 .text1 strong { font-size: 3.6vw;}
  .sec02 .text1 span { font-size: 3.6vw;  }
  .sec02 .text1 .line {
    font-size: 3.6vw;
    background-position: 0px -0.7vw;
  }
  .sec02 .text2 {
    margin-top: 5.2vw;
    margin-bottom: 9vw;
  }

  .sec02 .example_area { width: 95.2vw;}
  .sec02 .example_area .example {
    width: 47.4vw;
    height: 33.1vw;
    filter: drop-shadow(1.4vw 1.4vw 1.4vw rgba(0,0,0,0.3));
  }
  .sec02 .example_area .example::before {
    width: 5.5vw;
    height: 6.1vw;
    top: 13.5vw;
    right: -3.1vw;
  }
  .sec02 .example_area > p { width: 42.5vw;}

  .sec02 .example_list {
    margin-top: 1.9vw;
    margin-left: 2.9vw;
  }
  .sec02 .example_list li {
    padding-left: 3.6vw;
    margin-bottom: 1vw;
  }
  .sec02 .example_list li::before {
    width: 2.7vw;
    height: 2.7vw;
  }
  .sec02 .example_list li .line {
    height: 0.3vw;
    background-image: linear-gradient(to right, #b3b3b3, #b3b3b3 0.3vw, transparent 0.2vw, transparent 0.5vw);
    background-size: 0.9vw 0.3vw;
    margin: 0 1.4vw 0 1vw;
  }
  .sec02 .example_list li.c01 .line { width: 11.9vw;}
  .sec02 .example_list li.c02 .line { width: 11.9vw;}
  .sec02 .example_list li.c03 .line { width: 8.4vw;}
  .sec02 .example_list li.c04 .line { width: 15.3vw;}
  .sec02 .example_list li strong { font-size: 2.9vw;} 
  .sec02 .example_list li strong span { font-size: 2.3vw;}
  .sec02 .example_list li .etc {
    font-size: 1.5vw;
    margin-top: 1vw;
    margin-left: 1vw;
  }

  .sec02 .ad_list { padding-bottom: 7.1vw;}
  .sec02 .ad_list li { font-size: 2.7vw;}
  .sec02 .ad_list li:nth-child(2) { margin: 0 7.6vw 0 5.7vw;}



  .sec03 .rs_list { width: 98.1vw;}
  .sec03 .rs_list .reason_box { margin-bottom: 22.9vw;}
  .sec03 .rs_list .reason_box > p { width: 48.6vw;}
  .sec03 .rs_list .reason_box .rs_text {
    width: 40vw;
    height: 24.8vw;
    box-shadow: 1vw 1vw 1vw rgba(0,0,0,0.3);
    bottom: -19.8vw;
  }
  .sec03 .rs_list .reason_box .rs_text h2 {
    font-size: 2.8vw;
    padding: 2.9vw 0 1.9vw;
  }
  .sec03 .rs_list .reason_box .rs_text h2.two { line-height: 7vw;}
  .sec03 .rs_list .reason_box .rs_text h2 strong { font-size: 2.8vw;}
  .sec03 .rs_list .reason_box .rs_text p {
    font-size: 1.5vw;
    width: 34.7vw;
  }
  .sec03 .rs_list .reason_box .rs_text p strong { font-size: 1.5vw;}

  .sec03 .dakara {
    font-size: 3.5vw;
    letter-spacing: 0.2vw;
  }

  .sec03 .img04 {
    margin: 10.7vw 0 0;
    padding-bottom: 20vw;
  }
  .sec03 .img04 .text {
    font-size: 3.5vw;
    letter-spacing: 0.2vw;
    top: 12.9vw;
    left: 24.5vw;
  }
}



.sec04 .case_box {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto;
}
.sec04 .case_box.case1 { margin: 30px auto 172px;}
.sec04 .case_box.case2 { margin: 0 auto 240px;}
.sec04 .case_box.case3 { padding-bottom: 179px;}

.sec04 .case_box .case { width: 340px;}
.sec04 .case_box .case h2 {
  color: #fff;
  font-size: 28px;
}
.sec04 .case_box.case1 .case h2 { margin: 122px 0 40px;}
.sec04 .case_box.case2 .case h2 { margin: 50px 0 40px;}
.sec04 .case_box.case3 .case h2 { margin: 30px 0 40px;}
.sec04 .case_box .case p {
  color: #fff;
  line-height: 1.77;
}
.sec04 .case_box .case p strong {
  color: #fdf258;
  line-height: 1.77;
}
.sec04 .case_box .solution { width: 450px;}
.sec04 .case_box .solution h2 {
  font-size: 30px;
  line-height: 1.33;
  letter-spacing: 1px;
  margin-bottom: 33px;
}
.sec04 .case_box .solution h2 strong {
  color: #003e91;
  font-size: 30px;
}
.sec04 .case_box .solution p {
  line-height: 1.77;
  text-align: justify;
}
.sec04 .case_box .solution p strong {
  color: #f75a1f;
  line-height: 1.77;
}



.sec05 .step_box { margin-left: 260px;}
.sec05 .step_box.step1 { margin: 125px 0 77px 260px;}
.sec05 .step_box.step2 { margin: 0 0 75px 260px;}
.sec05 .step_box.step3 { margin: 0 0 75px 260px;}
.sec05 .step_box.step4 { margin: 0 0 80px 260px;}
.sec05 .step_box.step5 {
  margin: 0 0 0 260px;
  padding-bottom: 209px;
}
.sec05 .step_box h2 {
  font-size: 28px;
  margin-left: 134px;
}
.sec05 .step_box p {
  line-height: 1.77;
  margin-top: 35px;
}



.sec06 .voice_box.voice1 { margin: 75px 0 180px 25px;}
.sec06 .voice_box.voice2 { margin: 0 0 210px 455px;}
.sec06 .voice_box.voice3 {
  margin: 0 0 0 25px;
  padding-bottom: 130px;
}
.sec06 .voice_box .name {
  color: #003e91;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 30px;
}
.sec06 .voice_box .text {
  font-size: 16px;
  text-align: justify;
  line-height: 2;
  width: 570px;
}



@media screen and (min-width:768px) and ( max-width: 1050px) {
  .sec04 .case_box { width: 95.2vw;}
  .sec04 .case_box.case1 { margin: 3.2vw auto 16vw;}
  .sec04 .case_box.case2 { margin: 0 auto 22.9vw;}
  .sec04 .case_box.case3 { padding-bottom: 17vw;}

  .sec04 .case_box .case { width: 32.4vw;}
  .sec04 .case_box .case h2 { font-size: 2.7vw;}
  .sec04 .case_box.case1 .case h2 { margin: 11.5vw 0 3.8vw;}
  .sec04 .case_box.case2 .case h2 { margin: 4.8vw 0 3.8vw;}
  .sec04 .case_box.case3 .case h2 { margin: 2.9vw 0 3.8vw;}
  .sec04 .case_box .solution { width: 42.9vw;}
  .sec04 .case_box .solution h2 {
    font-size: 2.9vw;
    letter-spacing: 0.1vw;
    margin-bottom: 3.1vw;
  }
  .sec04 .case_box .solution h2 strong { font-size: 2.9vw;}


  .sec05 .step_box { margin-left: 24.8vw;}
  .sec05 .step_box.step1 { margin: 11.9vw 0 7.3vw 24.8vw;}
  .sec05 .step_box.step2 { margin: 0 0 7.1vw 24.8vw;}
  .sec05 .step_box.step3 { margin: 0 0 7.1vw 24.8vw;}
  .sec05 .step_box.step4 { margin: 0 0 7.6vw 24.8vw;}
  .sec05 .step_box.step5 {
    margin: 0 0 0 24.8vw;
    padding-bottom: 19.9vw;
  }
  .sec05 .step_box h2 {
    font-size: 2.7vw;
    margin-left: 12.8vw;
  }
  .sec05 .step_box p { margin-top: 3.3vw;}


  .sec06 .voice_box.voice1 { margin: 7.1vw 0 17.1vw 2.4vw;}
  .sec06 .voice_box.voice2 { margin: 0 0 20vw 43.3vw;}
  .sec06 .voice_box.voice3 {
    margin: 0 0 0 2.4vw;
    padding-bottom: 12.4vw;
  }
  .sec06 .voice_box .name {
    font-size: 2.1vw;
    margin-bottom: 2.9vw;
  }
  .sec06 .voice_box .text {
    font-size: 1.5vw;
    width: 54.3vw;
  }

}

.sec07 { background: url("https://www.kpnet.jp/wp-content/uploads/2020/11/dougu_bg.png") no-repeat top center;}
.sec07 .dougu_box.dougu {
 margin: 75px 0 0 25px;
 padding-bottom: 90px;
}
.sec07 .dougu_box .name {
  color: #003e91;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 30px;
}
.sec07 .dougu_box .text {
  font-size: 16px;
  text-align: justify;
  line-height: 2;
  width: 500px;
}
@media screen and (min-width:768px) and ( max-width: 1050px) {
  .sec07 .voice_box.voice1 { margin: 7.1vw 0 17.1vw 2.4vw;}
  .sec07 .voice_box.voice2 { margin: 0 0 20vw 43.3vw;}
  .sec07 .voice_box.voice3 {
    margin: 0 0 0 2.4vw;
    padding-bottom: 12.4vw;
  }
  .sec07 .voice_box .name {
    font-size: 2.1vw;
    margin-bottom: 2.9vw;
  }
  .sec07 .voice_box .text {
    font-size: 1.5vw;
    width: 54.3vw;
  }
}