@charset "utf-8";
/* CSS Document */





section .container h2 small { padding: 0 0 20px; display: block; font-size: 24px; color: rgb(0, 76, 217); }




section.pc_top { /*background: url("/biz/common/images/img_bg_0.jpg") no-repeat center bottom;*/ background-color: #F5F5F7; background: #2C2E3B; color: white;
background: #2C2E3B url("/biz/common/images/key_visual_bg.jpg") no-repeat center bottom; }
section.pc_top .container { max-width: 1280px; padding: 60px 15px 60px; }
section.pc_top h2 small { display: block; padding-top: 20px; font-size: 24px; line-height: 1.5; font-weight: 600; }
section.pc_top h2 span { color: #D80000; }
section.pc_top .mp_row { display: flex; justify-content: center; /*align-items: center;*/ }

section.pc_top .mp_row .fee .title { margin: 0px; font-size: 18px; font-weight: 900; color: darkorange; }
section.pc_top .mp_row .fee .price { margin: -5px 0 5px; font-size: 26px; font-weight: 900; color: darkorange; }
section.pc_top .mp_row .fee .price span { font-size: 40px; font-family: "din-2014",sans-serif; line-height: 1; }
section.pc_top .mp_row .fee .price small { font-size: 13px; font-weight: 400;  }
section.pc_top .mp_row .spec { margin: 0 0 30px; font-size: 18px; }
section.pc_top .mp_row > div:last-of-type { margin-left: -160px; padding-top: 50px; }

section.pc_top .btn-outline-primary {
  border-radius: 100px;
  padding: 15px 50px;
  background-color: #2277EA;
	font-weight: 900;
	  font-size: 18px;
}
section.pc_top .btn-outline-primary {
  color: white;
  border-color: #2277EA;
}



@media screen and (max-width: 767px) {
section.pc_top .container { padding: 40px 15px 20px; }
section.pc_top .mp_row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 30px; }

section.pc_top h2 { margin: 0 0 20px; font-size: 28px; }
section.pc_top h2 small { font-size: 20px; }


section.pc_top .mp_row > div:last-of-type { margin-left: 0px; padding-top: 0px; }
section.pc_top .mp_row .price { margin: 0 0 10px; font-size: 16px; }
section.pc_top .mp_row .price span { font-size: 16px; }
section.pc_top .mp_row .spec { font-size: 16px; }

section.pc_top .mp_row .fee p:last-of-type { text-align: center; }
}





section.pc_merit {  }
section.pc_merit .container { max-width: 1020px; max-width: 1280px; margin: 0 auto; padding: 100px 15px 80px;  }
section.pc_merit h2 { margin: 0 0 80px; font-weight: 900; font-size: 42px; text-align: center; }
section.pc_merit .row { margin-bottom: 20px; }
section.pc_merit .row > div[class^="col"] { padding: 0 25px 25px; }
section.pc_merit .row > div[class^="col"] .icon { margin: 0 0 15px; text-align: center; }
section.pc_merit h3 { margin: 0 0 15px; font-weight: 800; font-size: 26px; line-height: 1.3; }
section.pc_merit h3 small { display: block; color: black; font-weight: 800; font-size: 18px; text-align: center; }
section.pc_merit p { font-size: 15px; line-height: 1.7; }

section.pc_merit ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  margin-bottom: 30px;
}

section.pc_merit li {
display: flex;
  font-weight: 500;
  gap: 10px;
	font-size: 15px;
}
section.pc_merit li::before {
  background: rgb(0, 76, 217);
  border-radius: 50%;
  content: "";
  flex-shrink: 0;
  height: 8px;
  margin-top: 9px;
  width: 8px;
  margin-left: 2px;
}

@media screen and (max-width: 767px) {
section.pc_merit .container { padding: 60px 15px 20px; }
section.pc_merit h2 { margin: 0 0 30px; font-size: 24px; }
section.pc_merit .row > div[class^="col"] { padding: 0 15px 20px; }
section.pc_merit ul { gap: 0; margin: 0; }
section.pc_merit ul li { font-size: 15px; }
section.pc_merit h3 { margin: 0 0 5px; font-weight: 800; font-size: 18px; line-height: 1.3; }
section.pc_merit h3 br { display: none; }
section.pc_merit p { margin: 0; font-size: 15px; line-height: 1.5; }
}







section.items { /*background-color: #F0F2F6; background-color: #f7f7f7; background: #2C2E3B;*/ background: #2C2E3B url("/biz/common/images/key_visual_bg.jpg") no-repeat center center; background-size: cover; }

section.items .container { max-width: 1400px; margin: 0 auto; padding: 100px 15px 60px; }

section.items h2 { margin: 0 0 40px; font-size: 42px; line-height: 1.3; text-align: center; font-weight: 900; color: white;  }

section.items h2 + p { margin: 0 auto 30px; font-size: 20px; text-align: center; color: white; line-height: 1.7; font-weight: 900;  max-width: 800px; }
section.items p:nth-child(3) { margin: 0 0 70px; text-align: center; color: white; line-height: 1.7; }

section.items h3 { margin: 0 0 15px; font-size: 24px; }

section.items .row { margin-bottom: 20px; }
section.items .row:last-of-type { margin-bottom: 60px; }
section.items .row > div[class^="col"] {  }
section.items .row > div[class^="col"] { margin: 0 0 25px; }
section.items .row > div[class^="col"] a { display: flex; align-items: flex-start; justify-content: center; align-items: center; flex-direction: column; border-radius: 14px 14px 10px 14px; padding: 30px 0; font-size: 16px; text-decoration: none; height: 100%; background-color: white; border: 1px solid #eee; font-weight: 700; position: relative; box-shadow: 0 6px #e0e0e0; overflow: hidden; color: black; }
section.items .row > div[class^="col"] a::after {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 12px;
  border-color: transparent #0a58ca #0a58ca transparent;
  content: "";
}
section.items .row > div[class^="col"] a:hover { border-color: #0a58ca; }
section.items .row > div[class^="col"] a:hover { text-decoration: underline; }
section.items .row > div[class^="col"] a:hover img { opacity: 0.7; }

section.items .row > div[class^="col"] a.wish { flex-direction: inherit; gap: 0 30px; text-align: left; line-height: 1.7; }
section.items .row > div[class^="col"] a div.fee { margin-top: 5px; }

section.items .row p { margin: 0 0 10px; line-height: 1.5; }


section.items .device .in { padding: 40px 30px 30px; background: white; border-radius: 4px; height: 100%; }
section.items .device .in .spec { margin-top: -30px; padding-left: 1rem; }
section.items .device .in li { font-size: 15px; }
section.items .device h3 { font-weight: 900; font-size: 32px; }
section.items .device h3 span { display: block; font-size: 20px; padding: 0 0 3px; }


section.items .device .badge { margin: 0; padding: 0; list-style-type: none; }
section.items .device .badge { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
section.items .device .badge li { display: block; padding: 6px 20px; font-size: 14px; border-radius: 100px; background: #EFEFEF; color: black; line-height: 1.6; }
section.items .device .badge li.development { background: #F15921; color: white; }
section.items .device .badge li.creative { background: #E0273E; color: white; }
section.items .device .badge li.office_work { background: #29438B; color: white; }
section.items .device .badge li.sales { background: #65337E; color: white; }





@media screen and (max-width:768px) {
section.items .container { padding: 50px 15px 10px; }
section.items .row:last-of-type { margin-bottom: 0px; }
section.items .device .in { padding: 30px 20px;  }
section.items .device .in .img { margin-top: -30px;  }
section.items .device .in .spec { margin-top: -60px; }
section.items .device .in .spec li { font-size: 15px; }

section.items h2 { margin: 0 0 20px; font-size: 24px; }
section.items h2 small { font-size: 18px; line-height: 1.5;  }
section.items h2 + p { margin: 0 0 20px; font-size: 15px; text-align: left; color: white; line-height: 1.7; font-weight: 900; }
section.items p:nth-child(3) { margin: 0 0 30px; font-size: 15px; text-align: left; }

section.items .device h3 { font-size: 20px; }
section.items .row > div[class^="col"] { margin: 0 0 20px; }
section.items .row > div[class^="col"] a { padding: 15px 0; }
section.items .row > div[class^="col"] a img { max-width: 100px; height: auto; }
section.items .row > div[class^="col"] a.wish { gap: 0; line-height: 1.5; }
section.items .row > div[class^="col"] a.wish img { display: none; }
}










section.flow .container { max-width: 1280px; padding: 100px 15px 120px; }
section.flow .row > div[class^="col"]:not(:last-child)::after { top: 20px; }
section.flow .container h2 { margin: 0 0 50px; }
section.flow .row > div[class^="col"] .flow_icon { margin: 0 auto 20px; }
section.flow h2 {
  margin: 0 0 30px;
  font-size: 42px;
  line-height: 1.3;
  text-align: center;
  font-weight: 900;
}
section.flow h3 {  text-align: left; }

@media screen and (max-width:768px) {
section.flow .container { padding: 60px 15px 40px; }
section.flow .container h2 { margin: 0 0 20px; font-size: 24px; }

}







section.cta { margin: 0; background: url("/biz/common/images/cta_bg.png") no-repeat center; background-size: cover; }
section.cta .container { max-width: 1020px; margin: 0 auto; padding: 80px 15px 80px; }
section.cta .in { padding: 60px 0px; border-radius: 4px; /*border: 1px solid #ddd;*/ background-color: #fbf3ec; background: white; }

section.cta .in p:first-child { color: #ff8800; font-size: 20px; font-weight: bold; margin-bottom: 25px; }
section.cta .in>p:first-child { color: #ff8800; font-size: 20px; font-weight: bold; margin-bottom: 5px; }

section.cta .in h3 { margin: 0 0 40px; font-size: 26px; line-height: 1.3; font-weight: 900; }
section.cta h3 small { padding: 0 0 20px; display: block; font-size: 24px; color: rgb(0, 76, 217); }

section.cta .tel { margin: 0 0 5px; font-size: 27px; line-height: 1; display: flex; align-items: center; }
section.cta .tel i { margin: 0 5px 0 6px; }
section.cta .tel span { display: inline-block; font-size: 32px; font-weight: 900; font-family: "din-2014",sans-serif; }
section.cta .hours { margin: 0 0 20px; font-size: 15px; }
section.cta .hours small { font-size: 15px; }

section.cta .mp_btn { padding: 5px 30px; max-width: 300px; height: 70px; border-radius: 100px; font-size: 22px; font-weight: bold; line-height: 1.2; display: flex; align-items: center; color: white; text-decoration: none; justify-content: center; }
section.cta .mp_btn small { font-size: 16px; font-weight: normal; }
section.cta .mp_btn i { margin-left: auto; }

section.cta .mp_btn.contact { background-color: rgb(182, 20, 59); box-shadow: none; }
section.cta .mp_btn.contact:hover { box-shadow: none; box-shadow: none; }

section.cta .mp_btn:hover { text-decoration: none; color: white; box-shadow: none; transform: none; opacity: 0.7; }
section.cta .mp_btn:active .btn:visited { color: #fff; text-decoration: none; }

@media screen and (max-width: 767px) {
section.cta .container { padding: 60px 15px 60px; }
section.cta .in { padding: 40px 20px; }
section.cta .in p:first-child { font-size: 16px; }
section.cta .in h3 { margin: 0 0 20px; font-size: 20px; }
section.cta .row > div[class^="col"] { margin-bottom: 20px; }
}





/* スマートアタッシュ用 ↓ */



section.faq { background-color: #F5F5F7; }
section.faq .container { padding: 50px 15px 70px; }
section.faq h2 { font-size: 30px; font-weight: 700; text-align: center; margin: 0 0 50px; line-height: 1.3; }
section.faq h2 small { font-size: 25px; padding: 0 0 10px; }
section.faq .q {  border-bottom: 1px solid #ddd;  font-weight: 700; }
section.faq .a {  border-bottom: 1px solid #ddd;  }


@media screen and (max-width:768px) {
section.faq .container { padding: 50px 15px 20px; }
section.faq .container h2 { margin: 0 0 30px; font-size: 30px; }

}





#gotop a {
  display: block;
  background: url("/common3/images/ic_goto_top.png") no-repeat left top;
    background-size: auto;
  background-size: 100%;
  width: 60px;
  height: 60px;
  text-indent: -99em;
  overflow: hidden;
  transition: all .25s ease;
}






footer {
  padding: 60px 15px 60px;
  text-align: center;
  background-color: white;
}





section.advantage { background: #f1f7fc; background-size: cover; }
section.advantage .container { max-width: 1280px; margin: 0 auto; padding: 70px 15px 90px; }
section.advantage h3 { text-align: center; }
section.advantage h3 .diagonal { margin: 0 0 40px; font-size: 25px; color: #001e6e; font-weight: 510; display: flex; justify-content: center; align-items: flex-end; line-height: 1; color: #004496; }
section.advantage h3 .diagonal::before,.diagonal::after {
  width: 1px;
  height: 28px;
  content: "";
  background-color: #001e6e;
}

section.advantage h3 .diagonal::before {
  margin-right: 0.7em;
  transform: rotate(-30deg);
}

section.advantage h3 .diagonal::after {
  margin-left: 0.7em;
  transform: rotate(30deg);
}
section.advantage h3 span { content: ""; display: block; width: 18%; height: 100%; background: transparent linear-gradient(90deg, #004c7a 0%, #000062 50%, #000062 70%, #0075e5 100%); left: 0; top: 50%; -webkit-transform: skew(-10deg)translateY(-50%); transform: skew(-15deg) translateY(-50%); z-index: -1; margin: 0 auto; padding: 5px 0px; color: white; font-weight: 700; font-size: 38px; }
section.advantage .row { margin: 40px 0 0; }
section.advantage .row_2 { margin: 70px 0 0; display: flex; }
section.advantage .row p { text-align: center; }
section.advantage .row .title { font-size: 25px; font-weight: 750; margin: 0 0 5px 0; color: #0044ad; }
section.advantage .row img { border: 3px solid #08a7f4; border-radius: 7px; }
section.advantage .row .text { width: 240px; margin: 0 auto; }



@media screen and (max-width: 767px) {
section.advantage h3 span { width: 60%; font-size: 35px; }
section.advantage .row .title { font-size: 18px; }
section.advantage .row .text { width: 140px; font-size: 12px; line-height: 1.4; }
section.advantage .row .col-6 { margin-bottom: 38px; }	
section.advantage .row { margin: 20px 0 0; }
section.advantage .container { padding: 50px 15px 20px; }
section.advantage .row_2 { display: none; }
}





section.contact { background: url("/biz/common/images/pm_cta_bg.jpg") no-repeat center; background-size: auto; background-size: cover; }
section.contact .container { max-width: 1280px; margin: 0 auto; padding: 40px 0px 30px; }
section.contact .title { font-size: 30px; font-weight: 700; text-align: center; color: #333; }
section.contact .title small { font-size: 25px; }
section.contact .cotact_btn { display: flex; grid-column-gap: 25px; margin: 30px 0; justify-content: center; }
section.contact .cotact_btn .mp-btn { max-width: 240px; height: 65px; border-radius: 100px; font-size: 19px; font-weight: bold; line-height: 1.2; display: flex; align-items: center; text-decoration: none; justify-content: center; }
section.contact .cotact_btn .mp-btn:hover { text-decoration: none; box-shadow: none; transform: none; opacity: 0.7; }
section.contact .cotact_btn .btn_a { background-color: #666; color: white; padding: 5px 70px; border: solid 1px; border-color: #b5b5b5; }
section.contact .cotact_btn .btn_b { background-color: white; color: #666; border: solid 1px; padding: 5px 40px; }
section.contact p { text-align: center; font-size: 20px; font-weight: 600; color: #333; }



@media screen and (max-width: 767px) {
section.contact .cotact_btn { display: block; margin: 30px auto; }
section.contact .cotact_btn .btn_a { margin: 0 auto; }
section.contact .cotact_btn .btn_b { margin: 7px auto; }	
}




section.usage_example { background: url("/biz/common/images/pm_key_visual_bg.jpg") no-repeat center center; background-size: cover; }
section.usage_example .container { max-width: 1320px; margin: 0 auto; padding: 50px 0px 60px; }
section.usage_example .row .in { background-color: white; margin: 0 20px; height: 430px; }
section.usage_example .row .in .img-fluid { text-align: center; }
section.usage_example .row .in .title { font-size: 23px; text-align: center; /*padding: 14px 0px 12px;*/padding: 30px 0px 25px; color: #0e66c4; font-weight: 600; line-height: 1.4; }
section.usage_example .row .in .blank { padding: 30px 0px 25px; }
section.usage_example .row .in .text { margin: 0 27px 30px; padding: 0 0 10px; }
section.usage_example .row .list-number { color: #93aad2; font-weight: 600; font-size: 25px; margin: 0 0 5px 20px; }
section.usage_example .row .list-number b { font-size: 33px; }
section.usage_example h2 { color: white; font-weight: 700; font-size: 30px; text-align: center; margin-bottom: 45px; }
section.usage_example h2 small { color: white; font-size: 25px; }


@media screen and (max-width: 767px) {
section.usage_example .row .col-6 { flex: initial; width: 100%; max-width: 100%; }
section.usage_example .row .col-6:not(:first-child)	{ margin-top: 20px; } 
section.usage_example .row .in .text { font-size: 15px; }
section.usage_example .row .in .blank { padding: 14px 0px 12px; }
section.usage_example .row .col-6:first-child .in .blank { padding: 17px 0px 17px; }
section.usage_example .row .col-6:last-child .in .blank { padding: 17px 0px 20px; }
section.usage_example .row .col-6:first-child  .in { height: 382px; }
section.usage_example .row .col-6:last-child .in { height: 405px; }
}




section.flow { background: #e5f4ff; background-size: cover; }
section.flow .container { max-width: 1280px; padding: 60px 0 40px; }
section.flow .title { font-size: 30px; font-weight: 700; text-align: center; color: #0c2a70; }
section.flow .row { margin: 60px auto; }
section.flow .row .action { font-size: 23px; font-weight: 700; text-align: center; }
section.flow .row > div[class^="col"]:not(:last-child)::after {
  display: block;
  width: 60px;
  height: 60px;
  position: absolute;
  right: -50px;
  font-size: 60px;
  line-height: 60px;
  content: "\f0da";
  font-family: FontAwesome;	
}
section.flow .row > div[class^="col"]:not(:last-child)::after {
  top: 20px;
  color: #fbb03b;
}



@media screen and (max-width: 767px) {
section.flow .row > div[class^="col"]:not(:last-child)::after {
  display: none;
}
section.flow .row .col-6 { margin-bottom: 30px; }
section.flow .row { margin: 60px auto 0; }	
}





section.support { background: url("/biz/common/images/pm_key_visual_bg.jpg") no-repeat center center; background-size: cover; }
section.support .container { max-width: 1280px; margin: 0 auto; padding: 50px 0 30px; }
section.support .title { font-size: 30px; font-weight: 700; text-align: center; color: white; }
section.support h2 { text-align: center; color: white; font-weight: 700; margin: 50px auto 20px; line-height: 1.4; }
section.support .cotact_btn { display: flex; grid-column-gap: 25px; margin: 40px 0 30px; justify-content: center; }
section.support .cotact_btn .mp-btn { max-width: 240px; height: 65px; border-radius: 100px; font-size: 19px; font-weight: bold; line-height: 1.2; display: flex; align-items: center; text-decoration: none; justify-content: center; }
section.support .cotact_btn .mp-btn:hover { text-decoration: none; box-shadow: none; transform: none; opacity: 0.9; }
section.support .cotact_btn .btn_a { background-color: #2e95f9; color: white; padding: 5px 70px; border-color: #b5b5b5; }
section.support .cotact_btn .btn_b { background-color: white; color: #0572ff; padding: 5px 40px; }
section.support p { text-align: center; color: #fff; font-size: 20px; font-weight: 600; }
section.support .cotact_btn .mp-btn:hover { text-decoration: none; box-shadow: none; transform: none; opacity: 0.8; }



@media screen and (max-width: 767px) {
section.support .cotact_btn { display: block; margin: 30px auto; }
section.support .cotact_btn .btn_a { margin: 0 auto; }
section.support .cotact_btn .btn_b { margin: 7px auto; }
}




section.case_study .container { max-width: 1280px; margin: 0 auto; background: #e5f4ff; padding: 50px 10px; }
section.case_study .title { font-size: 30px; font-weight: 700; text-align: center; color: #001e8c; }
section.case_study h2 { text-align: center; font-size: 23px; color: #001e8c; padding: 20px 0; }
section.case_study .in { margin: 40px 10px; }
section.case_study .card { border: none; padding: 30px; margin: 80px auto 30px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); position: relative; }
section.case_study .card .case_number { position: absolute; font-size: 55px; color: #a8a6a6; top: -63px; left: 15px; line-height: 1.1; }
section.case_study .card .case_number small { font-size: 30px; }
section.case_study .case_1 { margin: 60px auto 30px; }
section.case_study .company { margin-top: 50px; }
section.case_study .company_title { font-size: 23px; font-weight: 600; color: #0044c7; }
section.case_study .company_name { font-size: 18px; padding: 10px 0 0; color: #0c2a70; font-weight: bold; }
section.case_study .assignment { position: relative; }
section.case_study .assignment_category { background-color: #0071ed; width: 15%; text-align: center; padding: 5px; color: white; position: absolute; top: -18%; font-weight: bold; }
section.case_study .assignment_text { border: solid 1px #999; border-radius: 3px; padding: 20px 18px 15px; margin: 10px; }
section.case_study .effect { position: relative; }
section.case_study .effect_category { background-color: #fbb03b; width: 15%; text-align: center; padding: 5px; color: #333333; position: absolute; top: -9%; font-weight: bold; }
section.case_study .effect_text { border: solid 1px #999; border-radius: 3px; padding: 25px 18px 0px; margin: 10px; }
section.case_study .triangle-clip { width: 60px; height: 70px; background-color: #0050bf; clip-path: polygon(44.00% 67.00%, 4% 36%, 87% 36%); margin: -13px auto; }
section.case_study .heading {
  align-items: center;
  display: flex;
  justify-content: center;
}
section.case_study .heading::before,
section.case_study .heading::after {
  background-color: #001e8c;
  content: "";
  height: 1.5px;
  width: 40px;
}
section.case_study .heading::before {
  margin-right: 15px;
}
section.case_study .heading::after {
  margin-left: 15px;
}

section.case_study .card .img-fluid { margin: 20px 0 auto; }
section.case_study .card .col-12 { margin-top: 15px; }



@media screen and (max-width: 767px) {
section.case_study .container { padding: 50px 10px 20px; }
section.case_study .card .row .col-6{ width: 100% }
section.case_study .company_title { line-height: 1.3; font-size: 21px; }
section.case_study .assignment_category { font-size: 14px; width: 40%; top: -5%; left: -9px; }
section.case_study .assignment_text { padding: 30px 18px 15px; font-size: 14px; margin: 0px; }
section.case_study .effect_category { font-size: 14px; width: 40%; top: -5%; left: -9px; }
section.case_study .effect_text { padding: 30px 18px 15px; font-size: 14px; margin: 0px; }
section.case_study .case_1 { margin: 0px auto 30px; }
section.case_study .card .case_number { font-size: 41px; top: -45px; line-height: 1; }
section.case_study .card .case_number small { font-size: 22px; }
section.case_study .company { margin-top: 18px; }	
	
}




section.product { background: #f2f2f2; }
section.product .container { max-width: 1280px; margin: 0 auto; padding: 50px 0 50px; }
section.product .title { font-size: 30px; font-weight: 700; text-align: center; color: #4d4d4d; }
section.product .spec_tbl { border-collapse: separate; table-layout: fixed; margin: 20px auto; width: 60%; }
section.product .spec_tbl th { background-color: #ddd; text-align: center; color: #3e3e3e; }
section.product .spec_tbl td { background-color: white; padding-left: 10px; overflow-wrap: break-word; }
section.product .in { display: flex; gap: 100px; justify-content: center; }
section.product .in img { padding-top: 25px; }
section.product ._sp_none { display: contents; }



@media screen and (max-width: 767px) {
section.product .in { gap: 20px; margin: 0 7px; }
section.product .spec_tbl th { font-size: 14px; }
section.product .spec_tbl td { font-size: 14px; }
section.product .spec_tbl { width: 90%; }
section.product .spec_tbl  ._pc_none { display: contents; }
section.product ._sp_none { display: none; }
}




section.price .container { max-width: 1280px; margin: 0 auto; padding: 50px 0 50px; }
section.price .price_tbl { border-collapse: separate; text-align: center; margin: 40px auto; width: 40%; }
section.price .price_tbl th { background-color: #0083d2; color: white; padding: 10px; font-size: 18px; font-weight: 600; }
section.price .price_tbl td { background-color: #c9e6fb; padding: 10px; font-size: 18px; font-weight: 600; }
section.price h2 { color: #333333; font-weight: 700; font-size: 30px; text-align: center; margin-bottom: 45px; }
section.price h2 small { color: #333333; font-size: 25px; }
section.price .sub_text { text-align: center; font-size: 24px; font-weight: 600; }
section.price .cotact_btn { display: flex; grid-column-gap: 25px; margin: 30px 0; justify-content: center; }
section.price .cotact_btn .mp-btn { max-width: 240px; height: 65px; border-radius: 100px; font-size: 19px; font-weight: bold; line-height: 1.2; display: flex; align-items: center; text-decoration: none; justify-content: center; }
section.price .cotact_btn .mp-btn:hover { text-decoration: none; box-shadow: none; transform: none; opacity: 0.7; }
section.price .cotact_btn .btn_a { background-color: #666; color: white; padding: 5px 70px; border: solid 1px; border-color: #b5b5b5; }
section.price .cotact_btn .btn_b { background-color: white; color: #666; border: solid 1px; padding: 5px 40px; }
section.price .tel_text { text-align: center; font-size: 20px; font-weight: 600; color: #333; }
section.price .waku_text { text-align: center; font-size: 20px; font-weight: 600; }
section.price .waku { border: 1px solid #0064c3; padding: 40px 0px 30px; width: 800px; margin: 10px auto; border-radius: 20px; }



@media screen and (max-width: 767px) {
section.price .sub_text { font-size: 20px; }
section.price .price_tbl { width: 90%; }
section.price .waku { width: 90%; }
section.price .cotact_btn { display: block; margin: 30px auto; }
section.price .cotact_btn .btn_a { margin: 0 auto; }
section.price .cotact_btn .btn_b { margin: 7px auto; }		
}





section.features { padding: 0 0 0px; }
section.features .container { max-width: 1280px; margin: 0 auto; position: absolute; top: 21rem; left: 50%; transform: translate(-50%, -50%); }
section.features .st_title { color: #333333; font-weight: 700; font-size: 28px; text-align: center; }
section.features .st_title small { color: #0048d9; font-size: 25px; padding: 0 0 20px; display: block;}
section.features .st_title  span { font-size: 38px; }
section.features .main_text { text-align: center; font-size: 40px; font-weight: 800; line-height: 1.4em; color: #0048d9; }
section.features .assignment { display: flex; justify-content: center; background-color: #c9e6fb; margin: 30px 100px 20px; border-radius: 20px; padding: 30px 0; align-items: center; opacity: 0.9; }
section.features .circle_a { background-color: white; border-radius: 100px; width: 160px; height: 160px; text-align: center; display: flex; justify-content: center; align-items: center; line-height: 1.6rem; color: #0071ed; font-weight: bold; margin: 0 20px 60px; font-size: 17px; }
section.features .circle_b { background-color: white; border-radius: 100px; width: 160px; height: 160px; text-align: center; display: flex; justify-content: center; align-items: center; line-height: 1.6rem; color: #0071ed; font-weight: bold; margin: 60px 20px 0; }
section.features .assignment img { margin-right: 50px; }
section.features .triangle_1 { margin: 0 auto; width: 60px; height: 30px; background: #c9e6fb; clip-path: polygon(0 0, 100% 0%, 50% 100%); }
section.features .triangle_2 { margin: 0 auto; width: 60px; height: 30px; background: #c9e6fb; clip-path: polygon(0 0, 100% 0%, 50% 100%); }
section.features .product_area .product_subtext { font-size: 25px; margin: 20px 0 10px -100px; font-weight: 700; }
section.features .product_name { text-align: center; font-size: 38px; font-weight: 800; background: transparent linear-gradient(90deg, #008eff 0%,#00beac 100%); width: 470px; padding: 0px 8px 8px; margin: 25px auto 10px; color: white; }
section.features .product_name small { font-size: 27px; }
section.features .product_area { margin-top: 60px; }
section.features .product_area .product_img { text-align: center; }
section.features .block_1 { position: relative; display: flex; }
section.features .block-left { background-color: #eaedf3; width: calc(100% - 30rem); height: 30rem; margin-top: 80px; }
section.features .block_2 { position: relative; display: flex; margin: 30px 0 190px; }
section.features .block-right { background-color: #eaedf3; width: calc(100% - 30rem); height: 29rem; margin-top: 80px; margin-left: auto; }
section.features .container_2 { max-width: 1280px; margin: 0 auto; position: absolute; top: 22rem; left: 50%; transform: translate(-50%, -50%); }



@media screen and (max-width: 767px) {
section.features .container { padding: 40px 15px 20px; background-color: #eaedf3; top: 14rem; }
section.features .st_title { font-size: 20px;}
section.features .st_title  span { font-size: 30px; }
section.features .assignment { margin: 10px 0px 10px; padding: 20px 5px 10px }
section.features .circle_a { margin: 0 5px 70px; font-size: 12px; width: 130px; height: 90px; line-height: 1.2rem; }
section.features .circle_b { font-size: 12px; width: 130px; height: 90px; line-height: 1.2rem; margin: 50px 5px 0; }
section.features .container_2 { top: 6rem; }
section.features .product_area .product_subtext { font-size: 17px; margin: 20px auto 0; }
section.features .product_name { font-size: 27px; margin: 10px auto 10px; width: 300px; }
section.features .product_name small { font-size: 17px; }	
section.features .block_2 { margin: 0 0 10px;}
section.features .product_area { margin-top: 10px; }
section.features .block-right { height: 20rem; }
}








section.pc_top { /*background: url("/biz/common/images/img_bg_0.jpg") no-repeat center bottom; background-color: #F5F5F7; background: #2C2E3B; color: white;*/
background: url("/biz/common/images/pm_key_visual_bg2.jpg") no-repeat center bottom; }
section.pc_top .container { max-width: 1300px; padding: 50px 0px 20px; }
section.pc_top h3 { font-size: 24px; line-height: 1.3; margin-bottom: 0; padding: 20px 0 0; }
section.pc_top h2 { font-size: 55px; font-weight: 900; line-height: 1.3; margin: 0 0 28px; }
section.pc_top .in { display: flex; justify-content: center; }
section.pc_top .sub_title { margin: 20px 0 0; font-size: 35px; line-height: 1.4; font-weight: 700; }
section.pc_top .text { font-size: 17px; margin: 80px 0 0; }
section.pc_top .cotact_btn { display: flex; grid-column-gap: 25px; margin: 50px 0 30px; justify-content: center; }
section.pc_top .cotact_btn .mp-btn { max-width: 240px; height: 60px; border-radius: 100px; font-size: 19px; font-weight: bold; line-height: 1.2; display: flex; align-items: center; text-decoration: none; justify-content: center; }
section.pc_top .cotact_btn .mp-btn:hover { text-decoration: none; box-shadow: none; transform: none; opacity: 0.9; }
section.pc_top .cotact_btn .btn_a { background-color: #2e95f9; color: white; padding: 5px 60px; border-color: #b5b5b5; }
section.pc_top .cotact_btn .btn_b { background-color: white; color: #0572ff; padding: 5px 30px; }
section.pc_top .cotact_btn .mp-btn:hover { text-decoration: none; box-shadow: none; transform: none; opacity: 0.8; }
section.pc_top .block_right { margin: 28px 0 10px 10px; }
section.pc_top .in .block_left { padding: 20px 0 0; }
section.pc_top .at_1 { animation: fadeIn 2s forwards; }
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
section.pc_top .at_2 { opacity: 0; /* 最初は透明 */
  opacity: 0; /* 最初は透明 */
  transform: translateX(-10%); /* 画面外の左端に移動 */

  /* アニメーションの適用 */
  animation: fadeInFromLeft 1s forwards ease-out;
}
@keyframes fadeInFromLeft {
  0% {
    opacity: 0;
    transform: translateX(-10%); /* 画面外の左端 */
  }
  100% {
    opacity: 1;
    transform: translateX(0); /* 元の位置 */
  }
}






@media screen and (max-width: 767px) {
section.pc_top .container { padding: 40px 15px 20px; }
section.pc_top .cotact_btn { display: block; margin: 30px auto; }
section.pc_top .cotact_btn .btn_a { margin: 0 auto; }
section.pc_top .cotact_btn .btn_b { margin: 7px auto; }
section.pc_top .block_right { display: none; }
section.pc_top .in .sp_img { margin: 0 0 0 17px; }
section.pc_top .text { font-size: 15px; margin: 10px; text-align: center; }
section.pc_top h2 { font-size: 38px; text-align: center; margin: 0; padding: 0 0 30px; }
section.pc_top h3 { font-size: 19px; padding: 0; }
section.pc_top .sub_title { font-size: 27px; text-align: center; margin: 0 auto 20px; }
}