@charset "UTF-8";
@import url("common.css");

/*  共通
-------------------------------------------------------------*/
.main__ttl{font-size: var(--fontSize-Noto-h1); text-align: center;}
.m__content-gr{background-color: var(--color-lightGray);}
.m__inner{margin: 0 auto; padding: 56px 24px; max-width: 1032px;}

/* アンカーリンクボックス */
.link__content{display: flex; flex-wrap: wrap; gap: 24px; padding: 56px 0;}
.link__box{ width: calc(100%/3 - 16px); background-color: #FFF; box-shadow: 0px 0px 10px rgba(204, 204, 204, 0.7); border-radius: 10px;}
.list__link{position: relative; display: flex; flex-direction: column; align-items: center; color: var(--color-lightBlue); text-decoration: none; padding: 24px 24px 40px;}
.list__link::after{content: ""; position: absolute; background: url(../images/common/icon_16arrow_down_bl.svg); width: 16px; height: 16px; bottom: 20px; right: 50%;}
.list__img{width: 100px;}
.list__ttl{margin: 8px 0 0; font-size: var(--fontSize-Yu-h3); font-weight: bold;}
.list__txt{margin: 4px 0 0; font-size: var(--fontSize-Yu-text2);}

/* 流れ */
.guide__container-gr{padding: 56px 0;}
.guide__container-ttl{margin: 0 0 32px; text-align: center; font-size: var(--fontSize-Noto-h1);}
.guide__container-subttl{margin: 0 0 8px; font-size: var(--fontSize-Yu-h3); font-weight: bold;}

/* 各説明 */
.js__accordion{padding: 16px 0 0;}
.guide__container{ margin: 56px 0 0; padding: 24px; background-color: #FFF; box-shadow: 0px 0px 10px rgba(204, 204, 204, 0.7); border-radius: 10px;}
.guide__container+.guide__container{margin: 40px 0 0;}
.guide__ttl{position: relative; font-size: var(--fontSize-Yu-h2); color: var(--color-lightBlue); cursor: pointer;}
.guide__ttl::after{content: ""; position: absolute; background: url(../images/common/icon_plus_bl.svg) no-repeat; width: 24px; height: 24px; top: 0; right: 0;}
.guide__ttl.is-open::after{background: url(../images/common/icon_minus_bl.svg) no-repeat;}
.guide__box{padding: 24px;}
.guide__box+.guide__box{margin: 24px 0 0;}
.guide__box-ttl{margin: 0 0 32px; padding: 0 0 16px; border-bottom: 1px solid var(--line-lightGray); font-size: var(--fontSize-Yu-h2); font-weight: bold;}
.guide__box p{font-size: var(--fontSize-Yu-text1); line-height: 1.6;}
.guide__box a{color: var( --color-lightBlue);}
.guide__box img{display: block; margin: 16px 0; border: 1px solid var(--line-lightGray); border-radius: 5px; width: 560px;}
.guide__link{color: var(--color-lightBlue);}
.link_heading{display: inline-block; margin: 8px 0 0; font-size: var(--fontSize-Yu-h4); font-weight: bold; color: var(--color-lightBlue);}
.guide__subbox{line-height: 1.7;}
.guide__subbox+.guide__subbox{margin: 32px 0 0;}
.guide__subbox h3{margin: 0 0 8px; font-size: var(--fontSize-Yu-h3);}
.guide__subbox h4{margin: 0 0 8px;}
.guide__subbox table{width: 730px; margin: 10px 0; font-size: 80%; border: 1px solid #CCC; line-height: 160%;}
.guide__subbox table th{padding: 15px; border: 1px solid #CCC; background: #EEE; vertical-align: top; font-weight: normal;}
.guide__subbox table td{padding: 15px; border: 1px solid #CCC; vertical-align: top;}

.guide__box-border{margin: 0 16px; padding: 24px; border: 1px solid var(--line-lightGray); border-radius: 10px;}
.guide__box-border+.guide__box-border{margin: 40px 16px 0;}