@charset "utf-8";

@media only screen and (min-width: 641px) {
/*menu*/
.consultation #siteHeader .siteUtility .siteLinks #menu_consultation {
  background:url(/ph/coccoapo/common/img/br_gnavi_on.png) no-repeat 2px bottom;
}
}

/*=================================

	1: parts for PC

================================*/

.consultation #mainContents {
	background:#f2f2f2;
}

.consultation .headLine02 {
  margin: 50px 0 0;
}

#consultationTitle {
	padding:50px 0 0;
	background:url(/ph/coccoapo/consultation/img/bg_title.jpg) no-repeat center 0;
	background-size:cover;
}

.consultationLead{
  font-size: 18px;
}

.consultationBox{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.consultationBox .category{
  width: 478px;
  background: #fff;
  margin: 50px 0 0;
  padding: 20px;
  box-sizing: border-box;
}

.consultationBox .category .questionTtl{
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  margin: 0 0 25px;
}

.consultationBox .category .questionTtl a{
  display: block;
  color: #555555;
  text-decoration: none;
  padding: 14px 10px;
  background: #bae8e2;
}

.consultationBox .category.kanpo .questionTtl a{
  background: #bae8ba;
}

.consultationBox .category.himan .questionTtl a{
  background: #e8e4ba;
}

.consultationBox .category.benpi .questionTtl a{
  background: #e8ccba;
}

.consultationBox .category .questionTtl a:hover{
  opacity: 0.8;
}

.consultationBox .category .questionList{
  font-size: 16px;
}

.consultationBox .category .questionList li{
  margin: 0 0 15px;
  padding: 0 0 0 25px;
  position: relative
}

.consultationBox .category .questionList li:after{
  left: 3px;
  top: 4px;
  width: 15px;
  height: 17px;
  position: absolute;
  background: url(/ph/coccoapo/consultation/img/icon_q01.png) no-repeat 0 0;
  background-size: 15px;
  content: "";
}

.consultationBox .category.kanpo .questionList li:after{
  background: url(/ph/coccoapo/consultation/img/icon_q02.png) no-repeat 0 0;
  background-size: 15px;
}

.consultationBox .category.himan .questionList li:after{
  background: url(/ph/coccoapo/consultation/img/icon_q03.png) no-repeat 0 0;
  background-size: 15px;
}

.consultationBox .category.benpi .questionList li:after{
  background: url(/ph/coccoapo/consultation/img/icon_q04.png) no-repeat 0 0;
  background-size: 15px;
}

.consultationBox .category .questionList a{
  text-decoration: none;
}

.consultationBox .category .questionList a:hover{
  text-decoration: underline;
}

.consultationBox .category .otherLink{
  position: relative;
  padding: 0 0 0 20px;
}

.consultationBox .category .otherLink a{
  text-decoration: none;
  font-weight: bold;
  color: #222;
}

.consultationBox .category .otherLink a:hover{
  text-decoration: underline;
}

.consultationBox .category .otherLink:after{
  left: 7px;
  top: 8px;
  width: 7px;
  height: 14px;
  position: absolute;
  background: url(/ph/coccoapo/consultation/img/link_arr.png) no-repeat 0 0;
  background-size: 7px;
  content: "";
}
.sec-contact {margin: 70px 0 0;}
.sec-contact h3{padding:15px 0;background:#aeaeae;text-align:center;color:#fff;font-weight:normal;font-size:14px;}
.sec-contact .contact{padding:15px;background:#fff}
.sec-contact .contact:before,.sec-contact .contact:after{content:"";display:table}
.sec-contact .contact:after{clear:both}
.sec-contact .contact dl{margin:0 10px 0 120px;float:left}
.sec-contact .contact dl:before,.sec-contact .contact dl:after{content:"";display:table}
.sec-contact .contact dl:after{clear:both}
.sec-contact .contact dl .tel-text{width:30px;height:17px;margin:7px 5px 0 0;float:left;overflow:hidden;font-size:0;text-indent:100%;white-space:nowrap;outline:none;background:url(/ph/coccoapo/consultation/img/faq-text1.png) no-repeat 0 0}
.sec-contact .contact dl .tel-number{width:197px;height:25px;float:left;overflow:hidden;font-size:0;text-indent:100%;white-space:nowrap;outline:none;background:url(/ph/coccoapo/consultation/img/faq-text2.png) no-repeat 0 0}
.sec-contact .contact .contact-text{width:459px;height:16px;margin-top:5px;overflow:hidden;font-size:0;text-indent:100%;white-space:nowrap;outline:none;background:url(/ph/coccoapo/consultation/img/faq-text3.png) no-repeat 0 0}

.sec-contact .privacy-text{margin:15px 0 0 95px}
.sec-contact .privacy-text:before,.sec-contact .privacy-text:after{content:"";display:table}
.sec-contact .privacy-text:after{clear:both}
.sec-contact .privacy-text dt{float:left;font-weight:bold;font-size:12px;}
.sec-contact .privacy-text dd{font-size:12px}
.sec-contact .privacy-text dd a{color:#222}.sec-contact .privacy-text dd a:hover{text-decoration:none}
.more { padding-bottom: 65px;}
.more__title {
  margin-bottom: 15px;
  font-size: 22px;
  color: #302549;
  line-height: 1.75;
  letter-spacing: .05em;
  text-align: center;
}
.more__title::after {
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  background-color: #302549;
  margin-top: 10px;
}
.more-content-container {
  font-size: 0;
}
.more-content {
  max-width: 255px;
  width: 100%;
  margin: 0 auto;
  background-color: #fff;
}
.more-content {
  display: inline-block;
  margin: 10px 10px 0;
}
.more-content__link {
  display: block;
  padding: 15px 10px 0;
}
.more-content__head {
  position: relative;
}
.more-content__img {
  width: 100%;
  height: 125px;
  border-radius: 10px;
  background-position: center;
  background-size: cover;
}
.more-content__title-wrap {
  text-align: center;
  padding: 10px 0;
}
.more-content__title {
  font-size: 1.6rem;
  color: #030000;
  line-height: 1.26;
  letter-spacing: .075em;
}
 @media only screen and (max-width: 640px) {
/*=================================

	2: parts for Smartphone

================================*/
  .inner img {
    width: auto;
  }

  #consultationTitle {
    padding:12px 0;
    margin:0;
    background-size:auto 100%;
  }

  .consultationLead{
    font-size: 14px;
  }

.consultationBox{
  display: block;
}

.consultationBox .category{
  width: auto;
  margin: 40px 0 0;
  padding: 15px;
  box-sizing: border-box;
}

.consultationBox .category .questionTtl{
  font-size: 20px;
  margin: 0 0 20px;
}

.consultationBox .category .questionTtl a{
  padding: 12px 10px;
}

.consultationBox .category .questionTtl a:hover{
  opacity: 1;
}

.consultationBox .category .questionList{
  font-size: 14px;
}

.consultationBox .category .questionList li{
  margin: 0 0 12px;
  padding: 0 0 0 20px;
  position: relative
}

.consultationBox .category .questionList li:after{
  left: 3px;
  top: 3px;
  width: 15px;
  height: 17px;
  position: absolute;
  background: url(/ph/coccoapo/consultation/img/icon_q01.png) no-repeat 0 0;
  background-size: 13px;
  content: "";
}

.consultationBox .category.kanpo .questionList li:after{
  background: url(/ph/coccoapo/consultation/img/icon_q02.png) no-repeat 0 0;
  background-size: 13px;
}

.consultationBox .category.himan .questionList li:after{
  background: url(/ph/coccoapo/consultation/img/icon_q03.png) no-repeat 0 0;
  background-size: 13px;
}

.consultationBox .category.benpi .questionList li:after{
  background: url(/ph/coccoapo/consultation/img/icon_q04.png) no-repeat 0 0;
  background-size: 13px;
}

.consultationBox .category .otherLink{
  font-size: 14px;
}

.consultationBox .category .otherLink:after{
  left: 7px;
  top: 7px;
  width: 6px;
  height: 14px;
  position: absolute;
  background: url(/ph/coccoapo/consultation/img/link_arr.png) no-repeat 0 0;
  background-size: 6px;
  content: "";
}





  .sec-contact{width:95%;margin:40px auto 0;}
  .sec-contact .sec-inner{padding-top:45px;padding-bottom:45px}
  .sec-contact .sec-inner:before,.sec-contact .sec-inner:after{content:"";display:block}
  .sec-contact .sec-inner:after{clear:both}
  .sec-contact h3{padding:10px;background:#aeaeae;text-align:center;color:#fff;font-weight:normal;font-size:14px;}
  .sec-contact .contact{padding:15px;background:#fff}
  .sec-contact .contact:before,.sec-contact .contact:after{content:"";display:block}
  .sec-contact .contact:after{clear:both}
  .sec-contact .contact dl{width:90%;margin:auto;float:none}
  .sec-contact .contact dl:before,.sec-contact .contact dl:after{content:"";display:block}
  .sec-contact .contact dl:after{clear:both}
  .sec-contact .contact dl .tel-text{width:30px;height:17px;margin:0px auto 10px;float:none;overflow:visible;font-size:0;text-indent:100%;white-space:nowrap;outline:none;background:url(/ph/coccoapo/consultation/img/faq-text1.png) no-repeat 0 0;display:block;;background-size:100% auto;}
  .sec-contact .contact dl .tel-number{width:200px;height:35px;margin:7px auto 0;;float:none;overflow:visible;font-size:0;text-indent:100%;white-space:nowrap;outline:none;background:url(/ph/coccoapo/consultation/img/faq-text2.png) no-repeat 0 0;background-size:100% auto;}
  .sec-contact .contact .contact-text{width:100%;height:16px;margin-top:10px;overflow:hidden;font-size:0;text-indent:100%;white-space:nowrap;outline:none;background:url(/ph/coccoapo/consultation/img/faq-text3.png) no-repeat 0 0;background-size:100% auto;}
  .sec-contact .privacy-text{margin:0 0 0 0; display:block; padding: 0 0 50px; text-align: center;}
  .sec-contact .privacy-text:before,.sec-contact .privacy-text:after{content:"";display:block}
  .sec-contact .privacy-text:after{clear:both}
  .sec-contact .privacy-text dt{float:none;font-weight:bold;font-size:12px;margin-right:0;margin-top:10px;}
  .sec-contact .privacy-text dd{font-size:12px}
  .sec-contact .privacy-text dd a{color:#222}.sec-contact .privacy-text dd a:hover{text-decoration:none}

  .more {
    padding-bottom: 20px;
  }
  .more__title {
    font-size: 20px;
    margin-bottom: 30px;
  }
  .more-content {
    max-width: 370px;
    margin-bottom: 30px;
  }
  .more-content__img {
    height: 175px;
  }
  .more-content__title-wrap {
    padding: 20px 0;
  }
  .more-content__title {
    font-size: 18px;
    font-size: 1.8rem;
  }

}



