@charset "UTF-8";
/**
 * Mixin
 * -----------------------------------------------------------------------------
 */
/**
 * 5.php　Styleから継承 PC
 * -----------------------------------------------------------------------------
 */
@media only screen and (max-width: 550px) {
  .page-sub .ttl span img {
    vertical-align: middle;
  }
}

body.article_20 .pic-main {
  margin-bottom: 95px;
}
@media only screen and (max-width: 550px) {
  body.article_20 .pic-main {
    margin-bottom: 42px;
  }
}

body.article_20 h1 {
  text-align: center;
  margin-bottom:0px;
}

body.article_20 #change_pic {
  width: 840px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #d0cece;
}
@media only screen and (max-width: 550px) {
  body.article_20 #change_pic {
    border-left: none;
    border-right: none;
  }
}

body.article_20 #change_pic ul.change_nav {
  display: table;
  -webtki-box-sizing: border-box;
  box-sizing: border-box;
  border-right: none;
  width: 100%;
}

body.article_20 #change_pic ul.change_nav li.last {
  border-right: none;
}

body.article_20 #change_pic ul.change_nav li {
  display: table-cell;
  border-right: 1px solid #d0cece;
  border-bottom: 1px solid #d0cece;
  background-color: #f6f5f5;
  width: 14.28%;
  text-align: center;
  vertical-align: middle;
  height: 70px;
  font-size: 13px;
  letter-spacing: 0.15em;
  color: black;
  cursor: pointer;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  transition: all 400ms cubic-bezier(0.39, 0.575, 0.565, 1) 0ms;
  -webkit-transition: all 400ms cubic-bezier(0.39, 0.575, 0.565, 1) 0ms;
  -moz-transition: all 400ms cubic-bezier(0.39, 0.575, 0.565, 1) 0ms;
  -o-transition: all 400ms cubic-bezier(0.39, 0.575, 0.565, 1) 0ms;
  -ms-transition: all 400ms cubic-bezier(0.39, 0.575, 0.565, 1) 0ms;
}
body.page-en.article_20 #change_pic ul.change_nav li {
  letter-spacing: .075em;
}

body.article_20 #change_pic ul.change_nav li:hover, body.article_20 #change_pic ul.change_nav li.active {
  background-color: white;
}

body.article_20 #change_pic .change_content {
  width: 100%;
  border-top: none;
  height: 300px;
  position: relative;
}
@media only screen and (max-width: 550px) {
  body.article_20 #change_pic .change_content {
    height: 391px;
  }
}

body.article_20 #change_pic .change_content.hide {
  background-image: none;
}

body.article_20 #change_pic .change_content a.close {
  position: absolute;
  bottom: 30px;
  right: 25px;
  z-index: 9999;
  opacity: 0;
  display: block;
}

body.article_20 #change_pic .change_content ul {
  width: 100%;
  height: 100%;
}

body.article_20 #change_pic .change_content ul li {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
}

body.article_20 #change_pic .change_content ul li p.txt0 {
  top: 93px;
  left: 533px;
}

body.article_20 #change_pic .change_content ul li p.txt1 {
  top: 54px;
  left: 524px;
}

body.article_20 #change_pic .change_content ul li p.txt2 {
  top: 73px;
  left: 533px;
}

body.article_20 #change_pic .change_content ul li p.txt3 {
  top: 412px;
  left: 39px;
}

body.article_20 #change_pic .change_content ul li p.txt4 {
  top: 159px;
  left: 547px;
}

body.article_20 #change_pic .change_content ul li p.txt5 {
  top: 176px;
  left: 509px;
}

body.article_20 #change_pic .change_content ul li p.txt6 {
  top: 182px;
  left: 579px;
}

body.article_20 #change_pic .change_content ul li img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
}

body.article_20 #change_pic .change_content ul li img.base {
  z-index: 5000;
  opacity: 0;
}

body.article_20 #change_pic .change_content ul li img.pic {
  z-index: 5001;
  opacity: 0;
}

/**
 * article_20 Common
 * -----------------------------------------------------------------------------
 */
.addtbor, section#original.box.bg_box div.inbox section.section-style1 div.txt_add, section#care.box div.box_how div.ttl_sub h5 {
  border-top: solid 1px #b8b5b5;
}

.addbbor, section#original.box.bg_box div.inbox section.section-style1 div.txt_add, section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dt, section#care.box div.box_how div.ttl_sub h5 {
  border-bottom: solid 1px #b8b5b5;
}

.addlbor {
  border-left: solid 1px #b8b5b5;
}

.addrbor {
  border-right: solid 1px #b8b5b5;
}

body.page-article_detail .sub_ttl {
      font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important;
      font-feature-settings: "palt";
}
body.page-article_detail .section-style1  p {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

body.page-article_detail .style_desctiption p,
body.page-article_detail .style_desctiption span,
body.page-article_detail .box p{
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 24px;
}
body.page-article_detail .article_ttl p{
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

body.page-article_detail .box .txt_description dt,
body.page-article_detail .box .txt_description em,
body.page-article_detail .box .txt_description span{
  font-size: 13px;
  line-height: 24px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/*
.page-article_detail.page-sub.article_20 li, .page-article_detail.page-sub.article_20 ul, .page-article_detail.page-sub.article_20 span, .page-article_detail.page-sub.article_20 div, .page-article_detail.page-sub.article_20 em, .page-article_detail.page-sub.article_20 h1, .page-article_detail.page-sub.article_20 h3, .page-article_detail.page-sub.article_20 h4, .page-article_detail.page-sub.article_20 h5, .page-article_detail.page-sub.article_20 h6, .page-article_detail.page-sub.article_20 dt, .page-article_detail.page-sub.article_20 dd {
  color: #000;
  font-size: 13px;
  line-height: 1.75;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

@media only screen and (max-width: 550px) {
  .page-article_detail.page-sub.article_20 li, .page-article_detail.page-sub.article_20 ul, .page-article_detail.page-sub.article_20 em, .page-article_detail.page-sub.article_20 h2, .page-article_detail.page-sub.article_20 h3, .page-article_detail.page-sub.article_20 h4, .page-article_detail.page-sub.article_20 h5, .page-article_detail.page-sub.article_20 h6, .page-article_detail.page-sub.article_20 dt, .page-article_detail.page-sub.article_20 dd {
    font-size: 11px;
    line-height: 20px;
  }
} */
@media only screen and (max-width: 550px) {
  .page-article_detail.page-sub.article_20 .ttl span {
    margin-top: -11px;
  }
  .page-article_detail.page-sub.article_20 .ttl span img {
    vertical-align: top;
  }
}
.page-article_detail.page-sub.article_20 em {
  font-style: normal;
}
.page-article_detail.page-sub.article_20 .fc-gray {
  color: #898484;
}
.page-article_detail.page-sub.article_20 section.bg_box {
  padding: 0;
}
@media only screen and (max-width: 550px) {
  .page-article_detail.page-sub.article_20 section .box-vam, .page-article_detail.page-sub.article_20 section .box-cell {
    display: block;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
.page-article_detail.page-sub.article_20 section .inbox {
  width: 840px;
  margin-left: auto;
  margin-right: auto;
  padding: 98px 0;
}
@media only screen and (max-width: 550px) {
  .page-article_detail.page-sub.article_20 section .inbox {
    width: 75.62%;
    padding: 53px 0;
  }
}
.page-article_detail.page-sub.article_20 section .inbox .txt_lead {
  text-align: center;
  font-size: 12px;
  line-height: 24px;
  text-align: center;
  margin-bottom: 91px;
}
@media only screen and (max-width: 550px) {
  .page-article_detail.page-sub.article_20 section .inbox .txt_lead{
    text-align: left !important;
    margin-bottom: 30px;
    font-size: 11px;
    line-height: 20px;
    width: 100%;
  }
}
.page-article_detail.page-sub.article_20 section .inbox h2 {
  margin-bottom: 51px;
  text-align: center;
}



@media only screen and (max-width: 550px) {
  .page-article_detail.page-sub.article_20 section .inbox h2 {
    margin-bottom: 24px;
    padding-bottom: 0;
  }
  .page-article_detail.page-sub.article_20 section .inbox h3 {
  text-align: center;
}
}
.page-article_detail.page-sub.article_20 section .inbox h3 {
  margin-bottom: 20px;
}
.page-article_detail.page-sub.article_20 section .inbox h3.tac {
  margin-bottom: 20px;
}
.page-article_detail.page-sub.article_20 section .inbox h4 {
  margin-bottom: 20px;
}
.page-article_detail.page-sub.article_20 section .inbox .ttl_center h3, .page-article_detail.page-sub.article_20 section .inbox .ttl_center p {
  text-align: center;
}
.page-article_detail.page-sub.article_20 section .inbox .txt_lead p {
}

/**
 * Main Pic
 * -----------------------------------------------------------------------------
 */
section.box.ttl_box.pos_01 div.inbox {
  width: 1000px;
  margin: 0 auto;
  padding: 0;
}
@media only screen and (max-width: 550px) {
  section.box.ttl_box.pos_01 div.inbox {
    width: 100%;
  }
}
section.box.ttl_box.pos_01 div.inbox h2.ttl {
  margin-bottom: 0;
}
section.box.ttl_box.pos_01 div.inbox div.pic-main {
  margin-top: 3px;
}
@media only screen and (max-width: 550px) {
  section.box.ttl_box.pos_01 div.inbox h1.article_ttl {
    width: 76.62%;
    margin: 0 auto;
  }
}


/**
 * #Original
 * -----------------------------------------------------------------------------
 */
@media only screen and (max-width: 550px) {
  section#original.box.bg_box {
    border-bottom: solid 1px #e2e1e1;
    position: relative;
    top:-11px;
  }
}
section#original.box.bg_box div.inbox section.section-style1 div.txt_add {
  padding: 31px 0;
  margin-bottom: 46px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.section-style1 div.txt_add {
    border-bottom: none;
    padding: 32px 0 0 0;
    margin-bottom: 0;
  }
}
section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl {
  display: table;
}
section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dt, section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dd {
  display: table-cell;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dt, section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dd {
    display: block;
    width: 100%;
  }
}
section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dt {
  font-size: 15px;
  line-height: 1.75;
  letter-spacing: .1em;
  padding-right: 123px;
  position: relative;
  top: 6px;
  width:150px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dt {
    margin-bottom: 19px;
    padding-right: 0;
    width: 100%;
    text-align: center;
  }
}
section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dt img {
  vertical-align: top;
  padding-top: 6px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.section-style1 div.txt_add dl dd p {
    width: 100%;
  }
}
section#original.box.bg_box div.inbox section.style_desctiption div {
  margin-bottom: 69px;
  margin-left: -13px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.style_desctiption div {
    margin: 0;
  }
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt {
  vertical-align: top;
  padding-right: 28px;
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt:first-child {
  width: 207px;
  padding-right: 28px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt:first-child {
    width: 100%;
    margin-bottom: 34px;
  }
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description {
    margin-bottom: 31px;
  }
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dt {
  padding-bottom: 10px;
  font-size: 13px;
  line-height: 24px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dt {
    padding-top: 14px;
    display: none;
  }
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd {
  padding-top: 12px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd {
    padding-top: 19px;
  }
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd ul li {
  font-size: 12px;
  line-height: 24px;
  display: table;
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd ul li span, section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd ul li em {
  display: table-cell;
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd ul li em {
  width: 55px;
}
.page-en section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd ul li em{
  width: 91px;
}
section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd ul li span.colon {
  padding: 0 7px 0 5px;
}
@media only screen and (max-width: 550px) {
  section#original.box.bg_box div.inbox section.style_desctiption dl.box-vam dt dl.txt_description dd ul li span.colon {
    padding: 0 3px 0 0;
  }
}


/**
 * Rare
 * -----------------------------------------------------------------------------
 */
section#rare.box div.inbox {
  padding: 98px 0 93px 0;
}
section#rare.box div.inbox section h2.tac {
  padding: 19px 0;
}
section#rare.box div.inbox section h3.tac {
  margin-bottom: 32px;
}
section#rare.box div.inbox section div.ptfix1 dl.box-vam:first-child {
  margin-bottom: 67px;
}

@media only screen and (max-width: 550px) {
  section#rare.box div.inbox {
    padding: 55px 0 52px 0;
  }
  section#rare.box div.inbox section h2.tac{
   padding: 0;
  }
  section#rare.box div.inbox section h3.tac {
    margin-bottom: 0;
  }
  section#rare.box div.inbox section div.ptfix1 dl.box-vam:first-child {
    margin-bottom: 8px;
  }
}


section#rare.box div.inbox section div.ptfix1 dl.box-vam:first-child dt {
  padding: 0 48px 0 0;
}
section#rare.box div.inbox section div.ptfix1 dl.box-vam dt, section#rare.box div.inbox section div.ptfix1 dl.box-vam dd {
  vertical-align: top;
}
section#rare.box div.inbox section div.ptfix1 dl.box-vam dt {
  padding: 0 0 0 48px;
}
section#rare.box div.inbox section div.ptfix1 dl.box-vam dd.box-cell {
  padding-top: 20px;
}
@media only screen and (max-width: 550px) {
  section#rare.box div.inbox section div.ptfix1 dl.box-vam dd.box-cell {
    padding-top: 8px;
  }
}
section#rare.box div.inbox section div.ptfix1 dl.box-vam dd.box-cell h4 {
  margin: 11px 0 22px 0;
}
@media only screen and (max-width: 550px) {
  section#rare.box div.inbox section div.ptfix1 dl.box-vam dd.box-cell h4 {
    margin: 14px 0;
  }
}
@media only screen and (max-width: 550px) {
  section#rare.box div.inbox section div.ptfix1 dl.box-vam dd.box-cell h4 img {
    vertical-align: middle;
  }
}

/**
 * nameshi
 * -----------------------------------------------------------------------------
 */
@media only screen and (max-width: 550px) {
  section#nameshi {
    border-bottom: solid 1px #e2e1e1;
  }
}
section#nameshi div.inbox {
  width: 860px;
}
@media only screen and (max-width: 550px) {
  section#nameshi div.inbox {
    width: 75.62%;
  }
}
section#nameshi div.inbox dl.box-vam dt.box-cell {
  padding-right: 97px;
}
section#nameshi div.inbox dl.box-vam dd h4 {
  margin: 3px 0 25px 0;
}
@media only screen and (max-width: 550px) {
  section#nameshi div.inbox dl.box-vam dd h4 {
    margin: 19px 0 24px 0;
  }
}
section#nameshi div.inbox dl.box-vam dd p {
  font-size: 12px;
  line-height: 21px;
}

/**
 * care
 * -----------------------------------------------------------------------------
 */
@media only screen and (max-width: 550px) {
  section#care.box {
    margin-bottom: 50px;
  }
}
section#care.box div.inbox {
  padding-bottom: 63px;
}
@media only screen and (max-width: 550px) {
  section#care.box div.inbox {
    padding-bottom: 53px;
  }
}
section#care.box div.ttl_center h3 {
  margin-bottom: 48px;
}
@media only screen and (max-width: 550px) {
  section#care.box div.ttl_center h3 {
    margin-bottom: 28px;
  }
}
section#care.box div.ttl_center p {
  margin-bottom: 84px;
}
@media only screen and (max-width: 550px) {
  section#care.box div.ttl_center p {
    margin-bottom: 34px;
    font-size: 11px;
    line-height: 20px;
    text-align: left;
  }
}
section#care.box div.box_how div.ttl_sub h5 {
  padding: 17px 0;
  text-align: center;
  margin-bottom: 75px;
}
@media only screen and (max-width: 550px) {
  section#care.box div.box_how div.ttl_sub h5 {
    padding: 7px 0 8px 0;
    margin-bottom: 28px;
  }
}
section#care.box div.box_how div.ttl_sub h5 img {
  vertical-align: middle;
}
section#care.box div.box_how div.ttl_sub p.pic_box {
  margin-bottom: 38px;
  text-align: center;
}
@media only screen and (max-width: 550px) {
  section#care.box div.box_how div.ttl_sub p.pic_box {
    margin-bottom: 28px;
  }
}
section#care.box div.box_how div.ttl_sub p.txt_sub {
  text-align: left;
  width: 670px;
  margin: 0 auto 72px auto;
}
@media only screen and (max-width: 550px) {
  section#care.box div.box_how div.ttl_sub p.txt_sub {
    width: 100%;
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic {
    width: 100%;
  }
}
section#care.box div#change_pic ul.change_nav li {
  height: 65px;
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic ul.change_nav li {
    height: 24px;
  }
}
section#care.box div#change_pic ul.change_nav li a {
  color:#000;
  display: inline-block;
}

section#care.box div#change_pic ul.change_nav li.active {
  border-bottom: none;
  background-color: #fbfbfb;
}
section#care.box div#change_pic ul.change_nav li.active a {
  position: relative;
  color:#000;
}
section#care.box div#change_pic ul.change_nav li.active a:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 4px;
  bottom: -8px;
  left: 0;
  z-index: 999;
  background: url(../../img/magazine/20/bg_wave.gif) repeat-x left top;
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic ul.change_nav li.active a:after {
    bottom: 5px;
    background: url(../../img/magazine/20/sp/bg_wave.gif) repeat-x left top;
    background-size: auto 4px;
  }
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic ul.change_nav li a {
   font-size: 10px;
    line-height: 1.5;
    display: inline-block;
    padding: 14px 0;
  }
}
section#care.box div#change_pic div.change_content ul li {
  width: 100%;
  height: 100%;
}
section#care.box div#change_pic div.change_content ul li div.box-vam {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #fbfbfb;
  width: 100%;
  padding: 72px 75px 72px 75px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  line-height: 21px;
  opacity: 1;
  z-index: 5002;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic div.change_content ul li div.box-vam {
    padding: 32px 0 32px 0;
  }
}
section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell {
  padding: 0 0 0 69px;
  vertical-align: top;
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell {
    width: 75.62%;
    margin: 0 auto;
  }
}
section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell:first-child {
  position: relative;
  padding: 0 16px 0 0;
  width: 303px;
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell:first-child {
    width: 75.62%;
    margin-bottom: 46px;
  }
}
section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell:first-child:after {
  content: "";
  position: absolute;
  display: block;
  right: -26px;
  top: 0;
  width: 1px;
  height: 100%;
  background-color: #d0cece;
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell:first-child:after {
    width: 100%;
    height: 1px;
    left: 0;
    bottom: -23px;
    top: auto;
  }
}
section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell h5 {
  margin-bottom: 18px;
  font-weight: bold;
  font-size: 13px;
  line-height: 1.75;
  letter-spacing: 0.1em;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
@media only screen and (max-width: 550px) {
  section#care.box div#change_pic div.change_content ul li div.box-vam div.box-cell h5 {
    margin-bottom: 10px;
  }
}