@charset "UTF-8";
/* ===============================
	common style
=============================== */
.bdr-box-red {
 padding: 0.5em;
 color: red;
 border: solid 1px red;
 text-align: center;
}
.caption-r {
 font-size: 1.2rem;
 text-align: right;
}
.main-img .caption-r {
 padding-right: 0.2em;
}
/* figure */
.fig-caption-bottom figcaption {
 color: #999;
}
/* アローボタン・左 */
.btn-arrow-left a {
 display: inline-block;
 padding: 0.5em 1em 0.5em 2em;
 line-height: 1.4;
 background: #fff;
 border: solid 1px #535353;
 border-radius: 0.5rem;
 position: relative;
}
.btn-arrow-left a::before {
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
 content: "\f105";
 display: inline-block;
 font-size: 1.2em;
 line-height: 1;
 position: absolute;
 top: 0.5em;
 left: 0.75em;
}
.btn-arrow-left a:hover {
 background: #535353;
 color: #fff;
 text-decoration: none;
}
/* こちらアンダーライン*/
.link-detail {
 color: #03c;
 border-bottom: solid 1px #03c;
 text-decoration: none;
}
a.deco-none {
 text-decoration: none;
}
/* メインタイトル */
.main-title {
 font-weight: 500;
 text-align: center;
}
/* サブセクション */
.sub-item {
 border-bottom: solid 1px #656565;
}
.sub-item .sub-title {
 font-weight: 500;
}
.sub-item .text {
 line-height: 1.6;
}
a.link-underline {
 text-decoration: underline;
}
.ttl-bdr {
 padding: 0.2em;
 border: solid 1px #999;
 text-align: center;
}
/* サブサブセクション */
.sub-sub-title {
 padding-left: 0.5em;
 border-left: solid 2px #000;
}
/* スライドショー */
.swiper-container {
 color: #000;
 padding-top: 0em;
 padding-bottom: 3em;
}
.swiper-slide .slide-img img {
 width: 100%;
}
.slide-header {
 display: flex;
 justify-content: space-between;
 align-items: center;
}
.slide-ttl {
 font-weight: 600;
}
/* スライドショー（ボタン上） */
ul.slide-pagination-text.top-button {
 display: flex;
 flex-wrap: wrap;
 margin-bottom: 0.25em;
}
ul.slide-pagination-text.top-button li {
 width: 33%;
 margin-left: 0.5%;
 margin-top: 1rem;
}
ul.slide-pagination-text.top-button li:nth-child(4n-3) {
 margin-left: 0;
}
ul.slide-pagination-text.top-button li:nth-child(-n+4) {
 margin-top: 0;
}
ul.slide-pagination-text.top-button li a:hover, ul.slide-pagination-text.top-button li a.active {
 background: #000;
 color: #fff;
 border: solid 1px #000;
}
ul.slide-pagination-text.top-button li a {
 display: flex;
 justify-content: center;
 align-items: center;
 height: 100%;
 padding: 0.6em 0;
 border: solid 1px #f5f5f5;
 background: #ddd;
 font-size: 1.4rem;
 line-height: 1.4;
 font-weight: 500;
 color: #fff;
 text-align: center;
 text-decoration: none;
 cursor: pointer;
}
span.effect {
 background: #e6e6e6;
 padding: 0.2em 0.8em;
 font-size: 1.2rem;
 margin: 8px 2px 0;
 display: inline-block;
}
/* ====================================
	スマートフォン専用スタイル
===================================== */
@media only screen and (max-width: 767px) {
 /* フレックスコンテナ */
 .flex-item-text, .flex-item-img {
  width: 100%;
 }
 .flex-item-img {
  margin-top: 2rem;
 }
 /* figure */
 .figures-title {
  /*margin: 2em 0 1rem;*/
  font-size: 1.4rem;
 }
 .fig-caption-bottom figcaption {
  font-size: 1.4rem;
 }
 /* メインタイトル */
 .main-title {
  margin: 5rem 0;
  font-size: 2.4rem;
  line-height: 1.4;
 }
 /* サブセクション */
 .sub-section {
  padding-top: 5rem;
 }
 .sub-section .sub-item {
  padding-bottom: 5rem;
 }
 .sub-section .sub-title {
  font-size: 1.8rem;
 }
 .sub-section .text {
  font-size: 1.5rem;
 }
 .text-container, .img-container {
  margin-top: 2rem;
 }
 /* 注釈セクション */
 .caption-section .base-width {
  padding-top: 5rem;
 }
 /* サブサブセクション */
 .sub-sub-title {
  margin: 3rem 0 1rem;
  font-size: 1.6rem;
 }
 /* 画像リスト */
 ul.list-figures li {
  margin-top: 1em;
 }
 ul.list-figures li:first-child {
  margin-top: 0;
 }
 ul.list-figures li .img {
  width: 100%;
 }
 ul.list-figures.sp-col2, ul.list-figures.col4 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
 }
 ul.list-figures.sp-col2 li, ul.list-figures.col4 li {
  width: 48%;
  margin-top: 1em;
 }
 ul.list-figures.sp-col2.no-gap li {
  width: 50%;
 }
 ul.list-figures.sp-col2 li:nth-child(-n+2), ul.list-figures.col4 li:nth-child(-n+2) {
  margin-top: 0;
 }
 /* スライドショー・ナビゲーション */
 .outer-container {
  margin-top: 3rem;
 }
 .slide-top-box {
  position: relative;
 }
}
/* ====================================
	PC&タブレット、印刷専用スタイル
===================================== */
@media print, screen and (min-width: 768px) {
 /* 画像サイズ設定 */
 .img-inbox {
  margin-left: auto;
  margin-right: auto;
 }
 .img-inbox.w860 {
  max-width: 860px;
 }
 /* フレックスコンテナ・画像下揃え */
 .fix-bottom-img > .flex-item {
  display: flex;
  flex-direction: column;
 }
 .fix-bottom-img > .flex-item > .img-container {
  margin-top: auto;
  padding-top: 1em;
 }
 .fix-bottom-img .add-caption-padding {
  padding-bottom: 2.2rem;
 }
 /* フレックスコンテナ・画像幅固定 */
 .fix-img-width {
  flex-wrap: nowrap;
  justify-content: space-between;
 }
 .flex-item-text {
  flex: 1;
 }
 .flex-item-img.w460 {
  width: 460px;
 }
 /* figure */
 .figures-title {
  /*margin: 2em 0 1rem;*/
  font-size: 1.4rem;
 }
 .fig-caption-bottom {
  font-size: 1.4rem;
 }
 /* メインタイトル */
 .main-title {
  margin: 8rem 0;
  font-size: 3rem;
  line-height: 1.4;
 }
 /* サブセクション */
 .sub-section {
  padding-top: 7rem;
 }
 .sub-section.bdr-top {
  margin-top: 6rem;
 }
 .sub-section .sub-item {
  padding-bottom: 7rem;
 }
 .sub-title {
  font-size: 2rem;
 }
 .text-container, .img-container {
  margin-top: 2rem;
 }
 /* 注釈セクション */
 .caption-section .base-width {
  padding-top: 7rem;
 }
 /* サブサブセクション */
 .sub-sub-title {
  margin: 8.3rem 0 1em;
  font-size: 1.8rem;
 }
 /* 画像リスト */
 ul.list-figures {
  display: flex;
  flex-wrap: wrap;
 }
 ul.list-figures li .img {
  width: 100%;
 }
 ul.list-figures.col2 {
  justify-content: space-between;
 }
 ul.list-figures.col2 li {
  width: 48%;
  margin-top: 1em;
 }
 ul.list-figures.col2.no-gap li {
  width: 50%;
 }
 ul.list-figures.col2 li:nth-child(-n+2) {
  margin-top: 0;
 }
 ul.list-figures.col3 li {
  width: 32%;
  margin-left: 2%;
 }
 ul.list-figures.col3 li:nth-child(3n-2) {
  margin-left: 0;
 }
 ul.list-figures.col4 li {
  width: 23%;
  margin-left: 2%;
 }
 ul.list-figures.col4 li:nth-child(4n-3) {
  margin-left: 0;
 }
 /* スライドショー・ナビゲーション */
 .outer-container {
  max-width: 767px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2em;
 }
}
/* ====================================
	オリジナルスタイル
===================================== */
.mt0 {
 margin-top: 0 !important;
}
.mb10 {
 margin-bottom: 10px !important;
}
.mb30 {
 margin-bottom: 30px !important;
}
.mtimg {
 margin-top: 52px;
}
.tr.fs {
 line-height: 1.5;
}
.pci_off {
 background-color: #9EA09B;
 color: #FFF;
 text-align: center;
 padding: 2px 0;
}
.pci_on {
 background-color: #7ca9be;
 color: #FFF;
 text-align: center;
 padding: 2px 0;
}
.point-box-blue {
 margin: 20px 0 40px;
 padding-bottom: 40px;
 border-bottom: 2px dotted #5EB7E8;
}
.point-box-pink {
 margin: 20px 0 40px;
 padding-bottom: 40px;
 border-bottom: 2px dotted #F0939C;
}
.pci_new_off {
 color: #969696;
}
.pci_new_on_blue {
 color: #5EB7E8;
}
.pci_new_on_pink {
 color: #F0939C;
}
.pci_new_off, .pci_new_on_blue, .pci_new_on_pink {
 padding-bottom: 10px;
 margin-left: -0.5em;
}
.sub-dooted-blue {
 color: #5EB7E8;
 font-size: 24px;
 display: flex;
 align-items: center;
}
.sub-dooted-blue:before, .sub-dooted-blue:after {
 content: "";
 flex-grow: 1;
 height: 1px;
 border-bottom: 2px dotted #5EB7E8;
 display: block;
}
.sub-dooted-blue:before {
 margin-right: .4em;
}
.sub-dooted-blue:after {
 margin-left: .4em;
}
.sub-dooted-pink {
 color: #F0939C;
 font-size: 24px;
 display: flex;
 align-items: center;
}
.sub-dooted-pink .effect {
 color: #000;
}
.sub-dooted-pink:before, .sub-dooted-pink:after {
 content: "";
 flex-grow: 1;
 height: 1px;
 border-bottom: 2px dotted #F0939C;
 display: block;
}
.sub-dooted-pink:before {
 margin-right: .4em;
}
.sub-dooted-pink:after {
 margin-left: .4em;
}
.tab {
 display: flex;
 flex-wrap: wrap;
 width: 100%;
}
.tab > li {
 width: 50%;
 list-style: none;
 box-sizing: border-box;
 text-align: center;
 font-size: 1.8rem;
 -webkit-transition: all 0.3s ease;
 -moz-transition: all 0.3s ease;
 -o-transition: all 0.3s ease;
 transition: all 0.3s ease;
}
.tab > li a {
 display: block;
 padding: 20px 0;
 text-decoration: none;
}
.tab-blue {
 background: #DCEEFA;
}
.tab-pink {
 background: #F8E2E3;
}
.tab-blue:hover {
 background: #5EB7E8;
}
.tab-pink:hover {
 background: #F0939C;
}
.tab-blue:hover a {
 color: #FFF;
}
.tab-pink:hover a {
 color: #FFF;
}
.tab-blue a {
 color: #5EB7E8;
}
.tab-pink a {
 color: #F0939C;
}
.tabarea .sub-section {
 display: none;
}
.tabarea .sub-section.show {
 display: block;
}
@media only screen and (max-width: 767px) {
 .flex-container.fix-img-width.mt2em {
  margin-top: 10px !important;
 }
 .fix-img-width.mb30 {
  margin-bottom: 0 !important;
 }
 .point-box {
  padding: 10px;
  margin-top: 30px;
 }
 .mtimg {
  margin-top: 15px;
 }
 .img-sp {
  width: 70%;
  height: auto;
  margin: 0 auto;
 }
 .sub-dooted-blue, .sub-dooted-pink {
  font-size: 18px;
  display: block;
  align-items: left;
 }
 .sub-dooted-blue:before, .sub-dooted-pink:before {
  margin: 0 0 10px;
  padding: 0;
 }
 .sub-dooted-blue:after, .sub-dooted-pink:after {
  margin: 0;
  padding: 0 0 10px;
 }
 .tab-base {
  padding-left: 0;
  padding-right: 0;
 }
}
/*追加(アプリ)*/
.flex-item-img.w150 {
 width: 15%;
 max-width: 150px;
}
.app {
 display: flex;
 justify-content: flex-end;
}
.app_btn {
 margin: 0 2rem 3rem 0;
 padding: 5px 2.5vw;
 font-size: 90%;
 text-align: center;
 color: #969696;
 border: solid 1px #969696;
 display: block;
 min-width: 10vw;
 float: left;
}
.photo {
 margin: 120px auto 260px;
}
a.btn-app {
 background: #535353;
 color: #fff;
 display: inline-block;
 padding: 0.5em 0.75em 0.5em 1.5em;
 font-size: 1.4rem;
 text-align: center;
 position: relative;
 text-decoration: none;
 margin: 1em 2rem 1rem 0;
}
a.btn-app::before {
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
 content: "\f105";
 display: inline-block;
 position: absolute;
 top: 40%;
 left: 0.5em;
 margin-top: -0.5em;
}
.mts {
 margin-top: 5px;
}
@media print, screen and (min-width: 768px) {
 .sponly {
  display: none;
 }
 #download .flex-container {
  padding: 0;
 }
 #download .flex-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
 }
 #download .flex-container .flex-item:first-child {
  width: 50%;
 }
 #download .flex-container .flex-item {
  width: 50%;
 }
 #download .ttl {
  margin-top: 2vw;
  line-height: 1.4;
  font-weight: bold;
 }
 #download .ttl em {
  font-size: 1.44em;
 }
 #download ul.app-links {
  display: flex;
  justify-content: space-between;
  margin: 1.5vw 0;
  padding-right: 20%;
 }
 #download ul.app-links li {
  width: 48%;
 }
 #download.app {
  text-align: right;
 }
 #download.app img {
  width: 70%;
 }
}
@media screen and (max-width: 767px) {
 .pconly {
  display: none;
 }
 .app_btn {
  font-size: 1.5rem;
  line-height: 200%;
  max-width: 100%;
  display: block;
  margin: 0 1rem;
  float: none;
 }
 a.btn-app {
  margin: 0 3rem;
 }
 #download {
  line-height: 1.4;
  font-size: 1.2rem;
  text-align: center;
 }
 #download .baseWidth {
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
 }
 #download .flex-container .flex-item:first-child {
  padding: 0 36%;
 }
 #download .ttl {
  margin-top: 1em;
  font-weight: bold;
  text-align: center;
 }
 #download .ttl em {
  font-size: 1.44em;
 }
 #download ul.app-links {
  display: flex;
  justify-content: space-between;
  margin: 2rem 0;
  padding: 0 10%;
 }
 #download ul.app-links li {
  width: 49%;
 }
 .flex-item-img.w150 {
  width: 40%;
 }
 #download.app {
  text-align: center;
 }
 #download.app img {
  width: 50%;
 }
}