/* 03_移住.pdf：1410 × 768 のビューポートに、1366px幅の誌面を左揃え。
   横位置・横幅は1410px基準（右44pxはサイドナビ領域）、縦位置は768px基準。
   扉・最終ページの背景（column_bg.png）はビューポートに合わせて cover 表示。
   scn03／scn05 の写真（994 × 1536 の縦長）は高さ100%・左揃えの縦帯として置き、
   右側に残る領域は地色 #fff で見せる。横を 100% にすると右の白地が消えるので不可。 */
/*--------------------------------------------------------
　共通style
--------------------------------------------------------*/
#story_3 .scn_set {
    background: #fff;
    overflow: hidden;
}

/* 右上ショルダー（雲＋紀美野町ではじまる 新しい暮らし）。
   shoulder.svg：386 × 109。誌面の天と右で裁ち落とした状態で書き出してあるので、
   右端を誌面右端（サイドナビ44px分を空ける）に、上端をページ天（0）に合わせる。 */
#story_3 .title_img {
    position: absolute;
    width: 27.376%;
    max-width: 386px;
    top: 0;
    right: 44px;
    z-index: 1;
}

#story_3 .main_area p,
#story_3 .last_area p {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    color: #093a56;
    font-weight: 500;
}

#story_3 .title_01 img,
#story_3 .right_area img,
#story_3 .last_area img {
    vertical-align: bottom;
}

#story_3 .text_01 p {
    font-size: 14px;
    line-height: 1.857;
}

#story_3 .text_01 p + p {
    margin-top: 26px;
}

/* 右側の写真グループ（キャプション込みの書き出し画像） */
#story_3 .right_area {
    position: absolute;
    z-index: 1;
}

/* 詳細DATA（common/info_btn.svg：195 × 41） */
#story_3 .info_btn {
    width: 39.078%;
    max-width: 195px;
    margin-top: 28px;
}

#story_3 .info_btn a {
    display: block;
    cursor: pointer;
}

#story_3 .info_btn img {
    vertical-align: bottom;
}

/* 誌面ではDATAパネルがアートボード下に流れているため、
   サイト側はテキストカラムの下端に合わせて全文が見えるようにしている */
#story_3 .info_btn + .info {
    width: 92.184%;
    left: -3.607%;
    top: auto;
    bottom: 0;
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    color: #093a56;
    font-size: 14px;
    line-height: 1.857;
    z-index: 2;
}

/*--------------------------------------------------------
　個別style
--------------------------------------------------------*/
/*--- scn01　扉 ---*/
#story_3 #scn01 {
    background: url("/book/focal/kimino/images/column2/column_bg.png") no-repeat center center / cover;
    opacity: 1;
    z-index: 501;
}

#story_3 #scn01 .fv_title {
    position: absolute;
    width: 80.766%;
    top: 11.979%;
    left: 10.035%;
}

#story_3 #scn01 .fv_title img {
    vertical-align: bottom;
}

/*--- scn02　リード ---*/
#story_3 #scn02 {
    background: #093a56;
}

#story_3 #scn02 .main_text {
    position: absolute;
    width: 49.645%;
    top: 35.938%;
    left: 23.475%;
}

#story_3 #scn02 .main_text > p {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    color: #fff;
    font-weight: 500;
}

#story_3 #scn02 .main_text .main_text_item {
    font-size: 20px;
    line-height: 2;
}

#story_3 #scn02 .main_text .credit_text {
    margin-top: 33px;
    font-family: "Koburina Gothic W3 JIS2004", sans-serif;
    font-size: 14px;
    line-height: 1.75;
}

/*--- scn03／scn05　左の縦帯写真＋白カード ---*/
#story_3 #scn03 {
    background: #fff url("/book/focal/kimino/images/column2/bg01.jpg") no-repeat left center / auto 100%;
}

#story_3 #scn05 {
    background: #fff url("/book/focal/kimino/images/column2/bg02.jpg") no-repeat left center / auto 100%;
}

/* 白カードは誌面の高さ（74.219%）を下限にして、本文が伸びたぶんは下へ広がるようにする。
   height 固定だとビューポートが低いときに本文がカードからはみ出し、
   地の白と下の余白が失われるため min-height ＋ 上下同じ padding で受ける。 */
#story_3 #scn03 .main_area,
#story_3 #scn05 .main_area {
    position: absolute;
    left: 8.440%;
    top: 12.891%;
    width: 45.461%;
    min-height: 74.219%;
    padding: 5.729vh 0 5.729vh 3.602%;
    background: #fff;
    box-sizing: border-box;
    z-index: 1;
}

#story_3 #scn03 .main_area .title_01 {
    width: 91.276%;
}

#story_3 #scn05 .main_area .title_01 {
    width: 91.361%;
}

#story_3 #scn03 .main_area .text_01,
#story_3 #scn05 .main_area .text_01 {
    width: 91.494%;
    margin-top: 23px;
}

#story_3 #scn03 .right_area {
    width: 31.950%;
    left: 53.954%;
    top: 19.857%;
}

#story_3 #scn05 .right_area {
    width: 33.546%;
    left: 52.394%;
    top: 19.857%;
}

/*--- scn04／scn06　白地ページ ---*/
#story_3 #scn04 .left_area,
#story_3 #scn06 .left_area {
    width: 35.390%;
    margin: 18.229vh 0 0 5.922%;
}

#story_3 #scn04 .left_area .title_01 {
    width: 100.607%;
}

#story_3 #scn06 .left_area .title_01 {
    width: 99.026%;
}

#story_3 #scn04 .left_area .text_01,
#story_3 #scn06 .left_area .text_01 {
    margin-top: 38px;
}

#story_3 #scn04 .right_area {
    width: 43.085%;
    left: 46.844%;
    top: 16.081%;
}

#story_3 #scn06 .right_area {
    width: 45.993%;
    left: 45.248%;
    top: 15.104%;
}

/*--- scn07　移住情報への導線 ---*/
#story_3 #scn07 {
    background: url("/book/focal/kimino/images/column2/column_bg.png") no-repeat center center / cover;
}

#story_3 #scn07 .last_area {
    position: absolute;
    width: 100%;
    top: 24.805%;
    height: 50.391%;
    left: 0;
    background: #fff;
}

#story_3 #scn07 .deco {
    position: absolute;
}

#story_3 #scn07 .deco_l {
    width: 15.035%;
    left: 8.972%;
    top: -6.718%;
}

#story_3 #scn07 .deco_r {
    width: 16.206%;
    left: 71.312%;
    top: 16.667%;
}

#story_3 #scn07 .last_ttl {
    position: absolute;
    top: 18.475%;
    left: 48.298%;
    transform: translate(-50%, 0);
    width: 60%;
    text-align: center;
    font-size: 26px;
    line-height: 1;
}

#story_3 #scn07 .last_text {
    position: absolute;
    top: 29.974%;
    left: 48.298%;
    transform: translate(-50%, 0);
    width: 60%;
    text-align: center;
    font-size: 18px;
    line-height: 1.82;
}

#story_3 #scn07 .last_btn {
    position: absolute;
    width: 39.165%;
    top: 64.729%;
    left: 48.440%;
    transform: translate(-50%, 0);
}

#story_3 #scn07 .last_btn a {
    display: block;
}

#story_3 #scn07 .last_btn img {
    vertical-align: bottom;
}