@charset "utf-8"; /* CSS Document */
/*--------------------------------------
　Main Index
---------------------------------------*/
#contents { width: 100%; }
/*--------------------------------------
　visArea
---------------------------------------*/

#visArea .mainArea {
 margin: 2rem auto;
 background: url("img/mv.png") center bottom no-repeat;
}
#visArea .mainArea .flame {
 width: 590px;
 margin: 0 auto;
 border: solid 5px #7fbdd2;
 background-color: #fff;
 padding: 1rem 2rem 3rem;
 text-align: center;
}
#visArea .mainArea .siteName {
 width: 115px;
 margin: 0 auto 2.5rem;
}
#visArea .mainArea .catchArea .catch {
 font-size: 3.8rem;
 font-weight: 700;
 line-height: 1.4;
 color: #4a89aa;
 text-align: center;
 margin: 0 0 3rem 0;
}
#visArea .mainArea .catchArea .catch .orange { color:#fc7619; }
#visArea .mainArea .catchArea .catch .bg {
 display: inline-block;
 color:#fff;
 font-size: 3rem;
 background-color: #4a89aa;
 padding: 0 0.5em;
}
#visArea .mainTxtBox .txtArea { text-align: left; }
/*--------------------------------------
オリジナル
---------------------------------------*/
.main .ac-btn {
 width: 550px;
 font-size: 1.8rem;
 color: #4a89aa;
 padding: 19px 65px;
 margin: 4rem auto;
}
.ac-btn::after,
.ac-btn.is-open:after {
 width: 29px;
 height: 29px;
 background-image: url("img/acc_open_index.png");
}
.ac-btn.is-open:after { background-image: url("img/acc_close_index.png"); }
.ttl_area_wrap {
 background: #4a89aa;
 position: relative;
 margin: 0 0 6rem -100%;
 padding: 4rem 0 4rem 100%;
}
.ttl_area_wrap::after {
 content: "";
 width: 50%;
 height: 24px;
 background: url("img/ttl_area_en01.png") no-repeat left top / auto 100%;
 position: absolute;
 top: -1.5rem;
}
.ttl_area_wrap .ttl_area {
 margin: 0 auto;
 position: relative;
 display: table;
}
.ttl_area_wrap .ttl {
 display: table-cell;
 vertical-align: middle;
 width: 42%;
 margin: 0;
 padding: 1rem 5rem 1rem 0;
 position: relative;
 font-size: 3rem;
 text-align: left;
 color: #fff;
}
.ttl_area_wrap .ttl a {
 display: block;
 width: 100%;
 position: relative;
 padding-right: 3rem;
 background: url("img/arrow01_white.svg") no-repeat right center / 22px auto;
 color: inherit;
}
.ttl_area p.lead {
 display: table-cell;
 vertical-align: middle;
 margin: 0;
 padding: 0 5rem;
 font-weight: bold;
 color: #fff;
 border-left: solid 1px #fff;
}
/***** addParts01 *****/
.addParts01 .btn-internal a::after { transform: translateY(-50%) rotate(90deg); }
/***** addParts02 *****/
.addParts02 {
 background-color: #eef6ff;
 position: relative;
}
.addParts02::before {
 content: '';
 background: url("img/add02_en.png") no-repeat left top / 100% auto;
 background-size: 100% auto;
 position: absolute;
 top: 4rem;
 left: 0;
 width: 647px;
 height: 77px;
}
.addParts02 h2.ttl {
 font-size: 4.6rem;
 text-align: center;
 margin: 4rem auto;
 color: #4a89aa;
}
.addParts02 h2.ttl .small { font-size: 3.2rem; }
.addParts02 .hosoku { margin-bottom: 8rem; }
.addParts02 .block {
 background-color: #fff;
 padding: 0;
 margin: 6rem 0 0;
 position: relative;
}
.addParts02 .block + .block { margin-top: 8rem; }
.addParts02 .block .price_area {
 color: #fff;
 font-size: 3.2rem;
 font-weight: 700;
 line-height: 1.4;
 padding: 1.7rem;
 padding-left: 13.7rem;
 background: #357194;
 width: 490px;
 position: absolute;
 z-index: 2;
 top: -2.9rem;
 left: -3.4rem;
}
.addParts02 .block .price_area .yellow { color:#ffd764; }
.addParts02 .block .price_area::after {
 content: "";
 width: 91px;
 height: 141px;
 background: url("img/company01_img03.png") no-repeat center top / 100% auto;
 position: absolute;
 left: 30px;
 top: -25px;
}
.addParts02 .block#com02 .price_area::after { background-image: url("img/company02_img03.png"); }
.addParts02 .block#com03 .price_area::after { background-image: url("img/company03_img03.png"); }
.addParts02 .blockTitArea {
 text-align: center;
 padding: 3.2rem 0 3.2rem 5rem;
 margin: 0 0 8rem 20rem;
 background: #9dd3ea;
}
#index .addParts02 .blockTit {
 display: inline-block;
 font-size: 5.2rem;
 font-weight: 700;
 line-height: 1.2;
 text-align: center;
}
.addParts02 .block .inner {
 padding: 0 5rem 6rem;
 background: #fff url("img/add02_bg01.png") no-repeat center bottom / 100% auto;
}
.addParts02 .block .title-wrap {
 position: relative;
 margin: 8rem 0 3rem;
 text-align: center;
}
.addParts02 .block .title-wrap .title {
 display: inline-block;
 padding: 2.2rem 3rem 0;
 background: url("img/add02_bg03.png") no-repeat left top / 46px auto;
 font-size: 2.8rem;
 line-height: 1.4;
 text-align: center;
}
.addParts02 .addParts02_01,
.addParts02 .addParts02_03 {
 padding-bottom: 7.8rem;
 background: url(img/add02_bg02.png) no-repeat bottom center / 42px auto;
}
.addParts02 .addParts02_01 {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
}
.addParts02 .addParts02_01 .box {
 width: calc((100% - 4rem) / 2);
 margin: 0;
 padding: 4rem 4.4rem;
 border: 1px solid #4a89aa;
 background-color: #fff;
}
.addParts02 .addParts02_01 .box .ttl {
 display: flex;
 align-items: center;
 justify-content: center;
 margin: 0 0 4rem;
 color: #4a89aa;
 font-size: 2.4rem;
 line-height: 1.4;
 text-align: center;
}
.addParts02 .addParts02_01 .box .small {
 text-indent: -2.5em;
 padding-left: 2.5em;
 font-size: 1.2rem;
}
.addParts02 .addParts02_02 .float-wrap {
 margin: 0 auto;
 padding: 0 52px;
}
.addParts02 .addParts02_02 .float-wrap .float-img.fl.t_small { width: 128px; }
.addParts02 .addParts02_03 .addParts02_03_wrap {
 background: #eef6ff;
 border: solid 1px #4a89aa;
 padding: 4.4rem 4rem 2rem; 
}
.addParts02 .addParts02_03 .addParts02_03_wrap .catch {
 color: #4a89aa;
 font-weight: 700;
 font-size: 2.4rem;
 line-height: 1.4;
 text-align: center;
 margin: 0 0 3.7rem;
}
/***** addParts04 *****/
.addParts04 { background-color: #f0f0f0; }
.addParts04 .ttl_area_wrap::after { background-image: url("img/ttl_area_en03.png"); }
.personArea .personBox {
 display: table;
 padding: 10px;
 position: relative;
}
.personArea .personBox .pic {
 display: table-cell;
 width: 115px;
 text-align: center;
 vertical-align: middle;
}
.personArea .personBox:first-child .pic img { width:74px; }
.personArea .personBox:last-child .pic img { width:85px; }
.personArea .personBox .txt {
 display: table-cell;
 vertical-align: middle;
 width: calc(100% - 150px);
 padding: 0;
}
#index .personArea .personBox .txt .ttl {
 font-size: 2.6rem;
 line-height: 1.4;
 background: #cae3ef;
 padding: 10px 32px;
 margin: 0;
 width: 460px;
 position: relative;
 z-index: 2;
 border-bottom: none;
}
.personArea .personBox .txt .ttl a {
 display: block;
 background: url("img/arrow01_black.svg") no-repeat right center / 22px auto;
 padding: 0 3rem 0.3rem 0;
}
.personArea .personBox .txt .inner {
 position: relative;
 margin: -1px 0 10px;
 border: 1px solid #4a89aa;
 background-color: #fff;
 padding: 3.5rem 4rem 2.7rem;
 margin-left: 5rem;
 top: -2rem;
 z-index: 1;
 min-width: 910px;
}
.personArea .personBox .txt .inner p { margin: 0; }
/***** addParts05 *****/
.addParts05.company { background: #f0f0f0; }
.addParts05.about .ttl_area_wrap::after { background-image: url("img/ttl_area_en02.png"); }
/***** addParts06 *****/
.addParts06 .float-wrap .fl { width: 520px; }

@media screen and (max-width: 480px) {
 /*------------
 Index
 ------------*/
 #contents { width: 100%; }
 /*--------------------------------------
　visArea
---------------------------------------*/
 #visArea {
  width: 100%;
  overflow: hidden;
 }
 #visArea .mainArea {
  background: none;
  margin: 1rem auto 4rem;
 }
 #visArea .mainArea .flame {
  width: 100%;
  border: none;
  background-color: transparent;
  padding: 0;
 }
 #visArea .mainArea .siteNameArea {
  display: table;
  background: url("img/mv.png") center 50% no-repeat;
  background-size: auto 100%;
  width: 100%;

 }
 #visArea .mainArea .siteName {
  width: 30%;
  margin: 0 auto;
  border: solid 2px #7fbdd2;
  background-color: #fff;
  padding: 1.6rem;
 } 
 #visArea .mainArea .mainTxtBox { padding: 2.0rem 4% 0; }
 #visArea .mainArea .catchArea .catch {
  font-size: 6.2vw;
  margin: 0 0 1.6rem;
 }
 #visArea .mainArea .catchArea .catch .bg { font-size: 5.9vw; }
 #visArea .mainTxtBox .txtArea { padding: 0; }
 /*--------------------------------------
 オリジナル
 ---------------------------------------*/
 .main .ac-btn {
  margin: 2rem auto;
  padding: 1.8rem 50px;
  font-size: 1.4rem;
 }
 .ac-btn::after, .ac-btn.is-open:after {
  width: 20px;
  height: 20px;
 }
 .ttl_area_wrap {
  position: relative;
  margin: 0 0 4rem;
  padding: 2.4rem 1rem 1.6rem;
 }
 .ttl_area_wrap::before {
  content: "";
  width: 50vw;
  height: 100%;
  background-color: #4a89aa;
  position: absolute;
  left: -50%;
  top: 0;
 }
 .ttl_area_wrap::after {
  width: 90%;
  height: 20px;
  top: -1rem;
 }
 .ttl_area_wrap .ttl {
  display: block;
  width: 100%;
  margin: 0 0 1.5rem 0;
  padding: 0;
  font-size: 2.4rem;
 }
 .ttl_area_wrap .ttl a {
  background-size: 18px auto;
  padding-right: 2.4rem;
 }
 .ttl_area {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
 }
 .ttl_area p.lead {
  margin: 2rem 0 0 0;
  float: none;
  width: 100%;
  padding: 2rem 0 0 0;
  border-left: none;
  border-top: 1px solid #fff;
  position: relative;
  display: block;
  font-weight: normal;
 }
 /***** addParts01 *****/
 /***** addParts02 *****/
 .addParts02::before {
  width: 80%;
  top: 3rem;
  height: 60px;
 }
 .addParts02 h2.ttl {
  font-size: 2.4rem;
  margin: 0 auto 4rem;
  position: relative;
  z-index: 1;
 }
 .addParts02 h2.ttl .small { font-size: 2rem; }
 .addParts02 .block .price_area {
  font-size: 2.1rem;
  line-height: 1.5;
  width: 100%;
  z-index: 2;
  position: relative;
  top: -2rem;
  left: -1rem;
  padding-left: 8.6rem;
 }
 .addParts02 .block .price_area::after {
  width: 64px;
  height: 96px;
  left: 10px;
  top: -20px;
 }
 .addParts02 .blockTitArea {
  text-align: center;
  padding: 1.5rem;
  margin: 0 0 2.5rem;
 }
 #index .addParts02 .blockTit {
  display: inline-block;
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  padding: 0;
  position: relative;
 }
 .addParts02 .block .inner { padding: 0 1.6rem 4rem; }
 .addParts02 .block .title-wrap {
  margin: 6rem 0 2rem;
 }
 #index .addParts02 .block .title-wrap .title {
  font-size: 2rem;
  background-size: 30px auto;
  padding: 0.6rem 1.6rem 0;
 }
 .addParts02 .float-wrap { margin-bottom: 0; }
 .addParts02 .float-wrap + .title-wrap { margin-top: 2rem;}
 .addParts02 .addParts02_01,
 .addParts02 .addParts02_03 {
  background-size: 30px auto;
  padding-bottom: 6rem;
 }
 .addParts02 .addParts02_01 { display: block; }
 .addParts02 .addParts02_01 .box {
  width: 100%;
  padding: 1.6rem;
 }
 .addParts02 .addParts02_01 .box + .box { margin-top: 2rem; }
 .addParts02 .addParts02_01 .box .ttl {
  margin: 0 0 1.6rem;
  font-size: 1.8rem;
 }
 .addParts02 .addParts02_02 .float-wrap { padding: 0; }
 .addParts02 .addParts02_02 .float-wrap .float-img.fl.t_small { width: 16%; }
 .addParts02 .addParts02_03 .addParts02_03_wrap { padding: 2rem 1.6rem; }
 .addParts02 .addParts02_03 .addParts02_03_wrap .catch {
  font-size: 1.8rem;
  margin: 0 0 1.6rem;
 }
 .addParts02 .addParts02_04 table { margin: 0 auto; }
 /***** addParts03 *****/
 /***** addParts04 *****/
 .personArea .personBox {
  display: block;
  padding: 0;
 }
 .personArea .personBox .pic {
  vertical-align: middle;
  width: 30px;
  height: 36px;
  position: absolute;
  z-index: 3;
  left: 1rem;
  top: 1rem;
 }
 .personArea .personBox:first-child .pic img,
 .personArea .personBox:last-child .pic img {
  width: auto;
  height: 100%;
 }
 .personArea .personBox .txt {
  display: block;
  width: 100%;
  margin: 0 0 2rem 0;
  padding: 0;
 }
 #index .personArea .personBox .txt .ttl {
  font-size: 1.8rem;
  padding: 1.6rem 1rem 1.6rem 6rem;
  margin: 0;
  max-width: 100%;
  width: 100%;
 }
 .personArea .personBox .txt .inner {
  position: static;
  margin: 0;
  padding: 1.5rem;
  min-width: 100%;
  width: 100%;
 }
 .personArea .personBox .txt .inner p {
  width: 100%;
  margin: 0;
 } 
 /***** addParts05 *****/
 /***** addParts06 *****/
 .addParts06 .float-wrap .fl { width: 100%; } 
}
/* SP_End */