@charset "utf-8";

/*-------------------------------Generic Classes-------------------------------*/

html, body {
    overflow-x: hidden;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 13px;
    line-height: 1.4em;
    z-index: 1;
    color: #404040;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

input,
textarea {
    font-family: 'Noto Sans JP', sans-serif;
}

/* for IE6 */

* html body {
    font-family: 'Noto Sans JP', sans-serif;
}

* html input,
* html textarea {
    font-family: 'Noto Sans JP', sans-serif;
}

#wrapper {
    height: 100%;
    width: 100%;
/*    background: url(../img/header_bg.gif) repeat-x;*/
}

.bold {
    font-weight: bold;
}

.boldBig {
    font-size: 14px;
    font-weight: bold;
}


/*--------------------------------Basic Layout--------------------------------*/

#main {
   /* width: 990px;*/
    height: 100%;
    overflow: hidden;
   /* margin: auto;*/
}

a {
    color: #00339d;
    text-decoration: underline
}

a:hover {
    text-decoration: none;
}


/*--------------------------------Header--------------------------------*/


h1 {
}

.more_next {
    text-align: right;
}

h2 {
    margin: 10px 0;
}

h3 {
    width: 740px;
    margin-bottom: 10px;
    font-size: 14px;
}

#other_contents h2 {
    width: 685px;
    padding: 7px 0 0 55px;
    height: 28px;
    font-size: 20px;
    background: url(../img/h2_bg.gif) no-repeat;
}

h2.sitemap_title {
    width: 900px;
    padding: 7px 0 0 55px;
    height: 28px;
    font-size: 20px;
    margin: 20px 0 0 10px;
    background: url(../img/h2_bg.gif) no-repeat;
}

#other_contents h3 {
    width: 715px;
    padding: 10px 0 0 25px;
    height: 28px;
    font-size: 18px;
    margin-top: 10px;
    background: url(../img/h3_bg_01.gif) no-repeat;
}

#other_contents h4 {
    width: 700px;
    margin-left: 10px;
    margin-bottom: 15px;
    padding: 0 0 0 10px;
    height: 18px;
    font-size: 15px;
    border-bottom: solid 3px #ccc;
    border-left: solid 7px #00399d;
}

#kinoshita_chooses h2 {
    background: url(../img/title_select6.gif) no-repeat;
    padding: 3px 0 0 25px;
    height: 24px;
    margin-top: 60px;
}

.top_chooses h2 {
    margin-top: 10px !important;
}

.top_title_text {
    float: right;
    width: 450px;
    text-align: right;
    padding-top: 5px;
    font-size: 14px;
}

#top_banner {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 20px;
    height: 100px;
    padding: 0px 15px;
}

#top_banner ul li {
    float: left;
    margin-right: 8px;
}

#top_banner ul li:last-child {
    margin-right: 0px;
}

#top_banner ul li img {
    border: 1px solid #cccccc;
    background-color: rgb(255, 255, 255);
    /* Firefox v3.5+ */
    -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
    /* Safari v3.0+ and by Chrome v0.2+ */
    -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
    /* Firefox v4.0+ , Safari v5.1+ , Chrome v10.0+, IE v10+ and by Opera v10.5+ */
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
    -ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=1,OffY=1,Color=#66000000,Positive=true)";
    filter: progid: DXImageTransform.Microsoft.dropshadow(OffX=1, OffY=1, Color=#66000000, Positive=true);
}

.opacityLink a:hover img,
.opacityLink a:active img {
    opacity: .70;
    /* Standard: FF gt 1.5, Opera, Safari */
    -ms-filter: "alpha(opacity=70)";
    /* IE 8 */
    filter: alpha(opacity=70);
    /* IE lt 8 */
    -khtml-opacity: .70;
    /* Safari 1.x */
    -moz-opacity: .70;
    /* FF lt 1.5, Netscape */
}

#top_title_1 {
    background: url(../img/title_kodawari.gif) no-repeat;
    width: 740px;
    margin-bottom: 10px;
    height: 32px;
    overflow: hidden;
    padding: 0px;
}

#top_title_2 {
    background: url(../img/title_mame.gif) no-repeat;
    width: 740px;
    margin-bottom: 10px;
    height: 32px;
    overflow: hidden;
    padding: 0px;
}

#top_title_3 {
    background: url(../img/title_otoku.gif) no-repeat;
    width: 740px;
    margin-bottom: 10px;
    height: 32px;
    overflow: hidden;
    padding: 0px;
}

#top_title_4 {
    background: url(../img/title_newinfo.gif) no-repeat;
    width: 740px;
    margin-bottom: 0;
    height: 32px;
    overflow: hidden;
    padding: 0px;
}

#top_title_5 {
    background: url(../img/title_serch_h3.jpg) no-repeat !important;
    width: 740px;
    margin-bottom: 0;
    height: 32px;
    overflow: hidden;
    padding: 0px;
}

.top_title_1,
.top_title_2,
.top_title_3,
.top_title_4 {
    padding: 7px 0 0 35px;
    margin: 0;
    font-size: 16px;
    float: left;
    width: 250px;
}

.top_title_5 {
    padding: 4px 0 0 25px;
    margin: 0;
    font-size: 16px;
    float: left;
    width: 250px;
}

#top_title_5 p.top_title_text_01 {
    font-size: 11px !important;
    padding-top: 3px;
}

#top_logo {
    float: left;
    width: 280px;
    height: 80px;
    background: url(../img/logo_bg.gif) no-repeat;
}

#header_tp_img {
    margin: 0 0 0 0;
    padding: 0;
    float: left;
}

.header_tp_img {
    margin: 0 0 0 0;
    padding: 0;
    float: left;
}

#user_info_list ul {
    list-style-type: none;
    float: right;
    margin: 40px 0 0 0;
    padding: 0;
    font-size: 12px;
}

#user_info_list li {
    float: left;
    margin-left: 10px;
    height: 30px;
    line-height: 45px;
}

#user_info_list li a.link_top {
    background: url(../img/link_top.gif) no-repeat;
    display: block;
    background-position: 3px;
    padding-left: 13px;
}

.fragment_text {
    padding: 15px 0 0 20px;
    width: 160px;
    float: left;
}

.fragment_pull {
    width: 170px;
    margin-left: 30px;
    padding-top: 20px;
    float: left;
}

.fragment_pull select {
    width: 150px;
    height: 22px;
}

.fragment_top {
    overflow: hidden;
}

.fragment_list_box {
    width: 378px;
    margin-left: 10px;
    margin-top: 15px;
    height: 145px;
    overflow: auto;
    background-color: #fff;
    border: solid 1px #dadada;
}

.fragment_list_box ul {
    margin: 10px 20px;
}

.fragment_list_box li {
    float: left;
    width: 150px;
    padding-right: 10px;
}

.fragment_list_box li a {
    background: url("../img/news_arrows.gif") no-repeat;
    padding-left: 9px;
    display: block;
    padding-top: 2px;
}

.fragment_bottom_link {
    float: right;
    margin-right: 10px;
}

.fragment_bottom_link li {
    float: left;
    margin-left: 10px;
}

.top_free_search {
    float: left;
    margin-left: 190px;
}

.top_free_search h2 {
    margin: 0 !important;
    background: url(../img/magnifying_glass_icon.png) no-repeat;
    padding-left: 20px;
    font-size: 16px;
    height: 20px;
    color: #00399D;
}

#select_eria2 {
    background: url(../img/top_map2.png) no-repeat;
    width: 265px;
    height: 220px;
    margin: 60px 0 0 60px;
}

#kyusyu {
    float: left;
    width: 100px;
    height: 100px;
}

#kyusyu a {
    display: block;
    background: url(../img/eria_top_kyusyu_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #e63741;
    font-weight: bold;
    text-decoration: none;
    margin-top: 150px;
}

#kyusyu a:hover {
    display: block;
    background: url(../img/eria_top_kyusyu_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#kansai {
    float: left;
    width: 60px;
    height: 220px;
}

#kansai a {
    display: block;
    background: url(../img/eria_top_kansai_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #f39b1e;
    font-weight: bold;
    text-decoration: none;
    margin-top: 120px;
}

#kansai a:hover {
    display: block;
    background: url(../img/eria_top_kansai_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#tohoku {
    float: left;
    width: 100px;
    height: 100px;
}

#tohoku a {
    display: block;
    background: url(../img/eria_top_tohoku_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #006bb9;
    font-weight: bold;
    text-decoration: none;
    margin-top: 50px;
    margin-left: 20px;
}

#tohoku a:hover {
    display: block;
    background: url(../img/eria_top_tohoku_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#tokai {
    float: left;
    width: 70px;
    height: 100px;
}

#tokai a {
    display: block;
    background: url(../img/eria_top_tokai_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #5bb22a;
    font-weight: bold;
    text-decoration: none;
    margin-top: 50px;
}

#tokai a:hover {
    display: block;
    background: url(../img/eria_top_tokai_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#kanto {
    float: left;
    width: 30px;
    height: 100px;
}

#kanto a {
    display: block;
    background: url(../img/eria_top_kanto_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 71px;
    height: 22px;
    color: #009a43;
    font-weight: bold;
    text-decoration: none;
    margin-top: 0;
}

#kanto li a:hover {
    display: block;
    background: url(../img/eria_top_kanto_on.png) no-repeat;
    width: 71px;
    height: 22px;
    color: #fff;
    text-decoration: none;
}


/* 2014年6月　九州･東北削除　*/

#select_eria3 {
    background: url(../img/top_map4.png) no-repeat;
    width: 265px;
    height: 220px;
    margin: 60px 0 0 65px;
}

#select_eria4 {
    background: url(../img/top_map5.png) no-repeat;
    width: 300px;
    height: 220px;
    margin: 60px 0 0 30px;
}

#kyusyu2 {
    float: left;
    width: 100px;
    height: 100px;
}

#kyusyu2 a {
    display: block;
    background: url(../img/eria_top_kyusyu_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #e63741;
    font-weight: bold;
    text-decoration: none;
    margin-top: 150px;
}

#kyusyu2 a:hover {
    display: block;
    background: url(../img/eria_top_kyusyu_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#kansai2 {
    float: left;
    width: 60px;
    height: 220px;
}

#kansai2 a {
    display: block;
    background: url(../img/eria_top_tokai_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #5bb22a;
    font-weight: bold;
    text-decoration: none;
    margin-top: 130px;
}

#kansai2 a:hover {
    display: block;
    background: url(../img/eria_top_tokai_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#tokai2 {
    float: left;
    width: 30px;
    height: 100px;
}

#tokai2 a {
    display: block;
    background: url(../img/eria_top_tokai_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #5bb22a;
    font-weight: bold;
    text-decoration: none;
    margin-top: 170px;
}

#tokai2 a:hover {
    display: block;
    background: url(../img/eria_top_tokai_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}


/*埼玉*/

#saitama {
    float: left;
    width: 30px;
    height: 50px;
}

#saitama a {
    display: block;
    background: url(../img/eria_top_tohoku_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #006bb9;
    font-weight: bold;
    text-decoration: none;
    margin-top: 70px;
    margin-left: 17px;
}

#saitama a:hover {
    display: block;
    background: url(../img/eria_top_tohoku_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#saitamaB {
    float: left;
    width: 30px;
    height: 50px;
}

#saitamaB a {
    display: block;
    background: url(../img/eria_top_tohoku_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #006bb9;
    font-weight: bold;
    text-decoration: none;
    margin-top: 70px;
    margin-left: 40px;
}

#saitamaB a:hover {
    display: block;
    background: url(../img/eria_top_tohoku_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}


/*神奈川*/

#kanagawa {
    float: left;
    width: 40px;
    height: 50px;
}

#kanagawa a {
    display: block;
    background: url(../img/eria_top_tohoku_off.png) no-repeat;
    padding: 7px 8px 0 12px;
    width: 48px;
    height: 25px;
    color: #006bb9;
    font-weight: bold;
    text-decoration: none;
    margin-top: 128px;
    margin-left: -26px;
}

#kanagawa a:hover {
    display: block;
    background: url(../img/eria_top_tohoku_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#kanagawaB {
    float: left;
    width: 40px;
    height: 50px;
}

#kanagawaB a {
    display: block;
    background: url(../img/eria_top_tohoku_off.png) no-repeat;
    padding: 7px 8px 0 12px;
    width: 48px;
    height: 25px;
    color: #006bb9;
    font-weight: bold;
    text-decoration: none;
    margin-top: 128px;
    margin-left: -2px;
}

#kanagawaB a:hover {
    display: block;
    background: url(../img/eria_top_tohoku_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}


/*東京*/

#tokyo {
    float: left;
    width: 10px;
    height: 220px;
}

#tokyo a {
    display: block;
    background: url(../img/eria_top_kansai_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #f39b1e;
    font-weight: bold;
    text-decoration: none;
    margin-top: 140px;
    margin-left: 15px;
}

#tokyo a:hover {
    display: block;
    background: url(../img/eria_top_kansai_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#tokyoB {
    float: left;
    width: 10px;
    height: 220px;
}

#tokyoB a {
    display: block;
    background: url(../img/eria_top_kansai_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #f39b1e;
    font-weight: bold;
    text-decoration: none;
    margin-top: 140px;
    margin-left: 40px;
}

#tokyoB a:hover {
    display: block;
    background: url(../img/eria_top_kansai_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}


/*千葉*/

#chiba {
    float: left;
    width: 20px;
    height: 70px;
}

#chiba a {
    display: block;
    background: url(../img/eria_top_tohoku_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #006bb9;
    font-weight: bold;
    text-decoration: none;
    margin-top: 70px;
    margin-left: 17px;
}

#chiba a:hover {
    display: block;
    background: url(../img/eria_top_tohoku_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

#chibaB {
    float: left;
    width: 20px;
    height: 70px;
}

#chibaB a {
    display: block;
    background: url(../img/eria_top_tohoku_off.png) no-repeat;
    padding: 7px 0 0 18px;
    width: 48px;
    height: 25px;
    color: #006bb9;
    font-weight: bold;
    text-decoration: none;
    margin-top: 70px;
    margin-left: 44px;
}

#chibaB a:hover {
    display: block;
    background: url(../img/eria_top_tohoku_on.png) no-repeat;
    width: 66px;
    height: 32px;
    color: #fff;
    text-decoration: none;
}

.afine_list_box {
    overflow: hidden;
    margin-left: 30px;
    margin-bottom: 40px;
}

.afine_list_box li {
    float: left;
    width: 160px;
    margin-right: 10px;
}

.afine_list_box dt.title_01 {
    background: url(../img/afine_list_title_01.gif) no-repeat;
    width: 120px;
    color: #fff;
    height: 18px;
    padding: 2px 0 0 40px;
}

.afine_list_box dt.title_02 {
    background: url(../img/afine_list_title_02.gif) no-repeat;
    width: 120px;
    color: #fff;
    height: 18px;
    padding: 2px 0 0 40px;
}

.afine_list_box dt.title_03 {
    background: url(../img/afine_list_title_03.gif) no-repeat;
    width: 120px;
    color: #fff;
    height: 18px;
    padding: 2px 0 0 40px;
}

.afine_list_box dt.title_04 {
    background: url(../img/afine_list_title_04.gif) no-repeat;
    width: 130px;
    color: #fff;
    height: 18px;
    padding: 2px 0 0 30px;
}

.afine_list_box dd {
    border: solid 1px #00399d;
    border-top: none;
    height: 80px;
    padding: 5px;
}

#afine_box h4 {
    background: url(../img/afine_title_01.gif) no-repeat !important;
    border: none !important;
    margin-bottom: 5px !important;
    padding: 3px 0 0 140px;
    color: #3f9126;
    height: 19px;
    width: 580px;
}

#afine_box p {
    padding-left: 25px !important;
    margin-bottom: 35px;
    width: 680px;
}

#afine_box p.afine_list_text {
    padding-left: 25px !important;
    margin-bottom: 5px !important;
}


/*--------------------------------navi--------------------------------*/

#nav_eria {
    margin: 0;
    padding: 0;
    /*overflow: hidden;*/
    margin: 0;
    padding: 0;
    width: 991px;
    height: 40px;
}

#nav_eria ul {
    /*margin-left: 5px;*/
}

#nav_eria li {
    float: left;
    margin: 0;
    padding: 0;
    height: 40px;
}

#nav_eria ul.navi_accordion li {
    width: 160px;
}

#nav,
#nav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    list-style-position: outside;
    position: relative;
    line-height: 1.5em;
}

#nav a {
    display: block;
    color: #fff;
    text-decoration: none;
}

#nav a:hover {
    text-decoration: underline;
    color: #fff;
}

#nav li {
    float: left;
    position: relative;
    height: 40px;
}

#nav li ul li {
    background: url(../img/arrow_w.png) no-repeat;
    padding: 5px 0 0 20px;
    background-color: #4e4e4e;
    opacity: 0.90;
    -ms-filter: "alpha(opacity=90)";
    background-position: 8px 7px;
    border-bottom: 1px solid #292929;
    height: 25px;
    color: #fff;
    z-index: 100;
}

#nav li ul li:hover {
    background-color: #292929;
}

#nav ul {
    position: absolute;
    display: none;
}

#nav li ul a {
    height: auto;
    float: left;
}

#nav ul ul {
    top: auto;
}

#nav li ul ul {
    left: 12em;
    margin: 0px 0 0 10px;
}

#nav li:hover ul ul,
#nav li:hover ul ul ul,
#nav li:hover ul ul ul ul {
    display: none;
}

#nav li:hover ul,
#nav li li:hover ul,
#nav li li li:hover ul,
#nav li li li li:hover ul {
    display: block;
}


/*-------------------------------TOP---------------------------------*/

#top {
    overflow: hidden;
    margin: 82px auto 0;
    background: url(../img/main_bg.gif) repeat-y;
    padding: 0 5px;
    width: 990px;
}

.top_img {
    float: left;
    width: 100px;
}

.top_text {
    font-size: 14px;
    margin: 10px;
    padding: 25px 0 0 100px;
    text-align: center;
}

#top_eria_search {
    float: left;
    width: 360px;
    height: 300px;
    margin: 10px 0 0 165px;
}

#top_eria_search h2 {
    float: left;
    background: url(../img/magnifying_glass_icon.png) no-repeat;
    color: #00399d;
    font-size: 16px;
    padding: 2px 0 0 27px;
}

.top_eria_search_text {
    padding: 10px 0 0 15px;
    float: left;
    width: 140px;
}

.top_train_search_text {
    float: left;
    width: 240px;
    padding: 10px 0 0 15px;
}

#top_train_search_box_01 {
    overflow: hidden;
    margin-bottom: 5px;
}

#top_train_search {
    float: left;
    width: 402px;
    margin: 10px 0 0 10px;
}

#top_train_search h2 {
    float: left;
    background: url(../img/magnifying_glass_icon.gif) no-repeat;
    color: #00399d;
    font-size: 16px;
    padding: 2px 0 0 27px;
}

#top_train_search .text_left {
    width: 250px;
}

#top_train_search .pull_right {
    float: left;
    width: 150px;
}

/* 20241210 */
#top-breadcrumb {
    overflow: hidden;
    margin: 90px auto 0;
    padding: 0px 0px;
    width: 1080px;
}

#list-breadcrumb {
    overflow: hidden;
    margin: 90px auto 0;
    padding: 10px 0px;
    width: 1080px;
}

#detail-breadcrumb {
    overflow: hidden;
    margin: 90px auto 0;
    padding: 0px 0px;
    width: 1080px;
}

#lower-breadcrumb {
    overflow: hidden;
    margin: 90px auto 0;
    padding: 0px 0px;
    width: 1080px;
}

.crumbs {
    display: flex; /* 横並びにする */
    list-style: none; /* デフォルトのリストスタイルを削除 */
    padding: 0; /* 内側余白を削除 */
    margin: 0; /* 外側余白を削除 */
    margin-bottom: 10px;
}

.crumbs li a {
    color: #00339d; /* リンクの色 */
}

/* 各パンくずリストアイテム */
.breadcrumb-item {
    display: flex; /* 横並び用 */
    align-items: center; /* 縦中央揃え */
}

/* liの間に矢印を追加 */
.breadcrumb-item + .breadcrumb-item::before {
    content: ">";
    margin: 0 8px; /* 矢印の左右に間隔 */
    color: #666; /* 矢印の色 */
    font-size: 14px; /* 矢印のサイズ */
}

/* パンくずリストのリンク */
.breadcrumb-item a {
    text-decoration: none; /* リンクの下線を削除 */
    color: #00339d; /* リンクの色 */
    transition: color 0.3s ease; /* ホバー時のアニメーション */
}

.breadcrumb-item a:hover {
    color: #0056b3; /* ホバー時のリンクの色 */
}

#top_box {
    background: url(../img/top_bg.jpg) no-repeat;
    width: 960px;
    height: 453px;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#top_box2 {
    background: url(../img/top_bg2.jpg) no-repeat;
    width: 960px;
    height: 453px;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#top_box3 {
    background: url(../img/top_bg3.jpg) no-repeat;
    width: 960px;
    height: 453px;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#top_eria_bnr_list {
    float: left;
    overflow: hidden;
}

#top_eria_bnr_list {
    margin-left: 180px;
    margin-top: 13px;
}

#top_eria_bnr_list li {
    float: left;
    padding-left: 12px;
}

#eria_title_box {
    width: 940px;
    background: url(../img/eria_title.gif) no-repeat;
    margin-left: 20px;
    height: 40px;
    overflow: hidden;
}

#train_title_box {
    width: 940px;
    background: url(../img/train_title.gif) no-repeat;
    margin-left: 20px;
    height: 40px;
    overflow: hidden;
}

#map_title_box {
    width: 940px;
    background: url(../img/map_title.gif) no-repeat;
    margin-left: 20px;
    height: 40px;
    overflow: hidden;
}

#serch_top_title_h2 {
    float: left;
    font-size: 22px !important;
    padding: 0 !important;
    margin-left: 60px!important;
}

#serch_top_title_p {
    float: right;
    margin-top: 15px;
}


/*----------------トップ変更20141222--------------------*/

#top_eria_searchB {
    float: left;
    width: 360px;
    height: 300px;
    margin: 10px 0 0 70px;
}

#top_eria_searchB h2 {
    float: left;
    background: url(../img/magnifying_glass_icon.png) no-repeat;
    color: #00399d;
    font-size: 16px;
    padding: 2px 0 0 27px;
}

.top_eria_searchB_text {
    padding: 10px 0 0 15px;
    float: left;
    width: 140px;
}

.top_train_searchB_text {
    float: left;
    width: 240px;
    padding: 10px 0 0 15px;
}

#top_train_searchB_box_01 {
    overflow: hidden;
    margin-bottom: 5px;
}

#top_train_searchB {
    float: left;
    width: 402px;
    margin: 10px 0 0 60px;
}

#top_train_searchB h2 {
    float: left;
    background: url(../img/magnifying_glass_icon.gif) no-repeat;
    color: #00399d;
    font-size: 16px;
    padding: 2px 0 0 27px;
}

#top_train_searchB .text_left {
    width: 250px;
}

#top_train_searchB .pull_right {
    float: left;
    width: 150px;
}

.top_free_searchB {
    float: left;
    margin-left: 70px;
    margin-top: 3px;
}

.top_free_searchB h2 {
    margin: 0 !important;
    background: url(../img/magnifying_glass_icon.png) no-repeat;
    padding-left: 20px;
    font-size: 16px;
    height: 20px;
    color: #00399D;
}

#crumbs {
    overflow: hidden;
    margin-bottom: 10px;
    width: 740px;
}

#crumbs li {
    float: left;
    margin-right: 10px;
    background: url(../img/crumbs.gif) no-repeat 0 50%;
    padding-left: 15px;
}

#crumbs li.fast {
    float: left;
    margin-right: 10px;
    background-image: none;
    padding-left: 0px;
}

#top_box4 {
    background: url(../img/top_bg4.jpg) no-repeat;
    width: 960px;
    height: 453px;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#top_box2017 {
    background: url(../img/top_bg2017.jpg) no-repeat;
    width: 960px;
    height: 509px;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#feesArea {
    width: 960px;
    height: 56px;
    text-align: center!important;
}

#feesArea h3.feesH3 {
    display: inline-block;
    font-weight: 500;
    color: #be0000;
    font-size: 26px;
    padding: 31px 0 0!important;
    letter-spacing: 8px;
}

#top_eria_bnr_listB {
    float: left;
    overflow: hidden;
}

#top_eria_bnr_listB {
    margin-left: 70px;
    margin-top: 10px;
}

#top_eria_bnr_listB li {
    float: left;
    padding-right: 25px;
}

#eria_title_box {
    width: 940px;
    background: url(../img/eria_title.gif) no-repeat;
    margin-left: 20px;
    height: 40px;
    overflow: hidden;
}

#train_title_box {
    width: 940px;
    background: url(../img/train_title.gif) no-repeat;
    margin-left: 20px;
    height: 40px;
    overflow: hidden;
}

#map_title_box {
    width: 940px;
    background: url(../img/map_title.gif) no-repeat;
    margin-left: 20px;
    height: 40px;
    overflow: hidden;
}

#serch_top_title_h2 {
    float: left;
    font-size: 22px !important;
    padding: 0 !important;
    margin-left: 60px!important;
    margin-top: 0;
}

#serch_top_title_p {
    float: right;
    margin-top: 15px;
}


/*--------------------------------contents--------------------------------*/

#main_contents {
    width: 740px;
    padding-left: 20px;
    float: left;
    margin-top: 7px;
}

#main_contents-2024 {/* 20241210 */
    width: 1080px;
    padding-left: 0px;
    margin-top: 7px;
}

p.tokusetsu {
    display: block;
    text-align: center;
    margin-top: 35px;
}

#low_contents-2024{/* 20250410 */
    width: 100%!important;
    overflow: hidden;
    padding: 0px!important;
    margin: 0 20px 0;
}



/* 20241225 */

.main_image_madori_eria {
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    width: 500px !important;
    height: auto !important;
    border: solid 1px #ccc;
    padding: 5px;
    margin-right: 20px;
    margin-bottom: 10px;
    background: #fff;
    float: left!important;
    display: inline-block;
    display: flex;
    align-items: center; /* 縦方向の中央 */
    justify-content: center; /* 横方向の中央 */
    text-align: center; /* 画像の中央揃え */
    position: relative; /* 必要なら追加 */
}

/* 画像自体を最大限中央にフィットさせる */
.main_image_madori_eria img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* 画像の比率を維持しつつ、枠内に収める */
}



.main_image_eria {
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    width: 500px !important;
    height: auto !important;
    border: solid 1px #ccc;
    padding: 0px;
    margin-bottom: 10px;
    background: #fff;
    float: left!important;
    /* 20161206 */
    display: inline-block;
}

.main_image_eria img {
    vertical-align: middle;
    text-align: center;
}

.main_image_eria_jigyo {
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    width: 350px !important;
    height: 350px !important;
    border: solid 1px #999;
    padding: 5px;
    background: #fff;
}

.main_image_eria_jigyo img {
    vertical-align: middle;
    text-align: center;
}

/* Swiper コンテナを .main_image_eria に合わせる */
/* メイン画像エリアのスタイルを修正 */
.main_image_eria {
    text-align: center;
    vertical-align: middle;
    width: 500px !important;
    height: auto !important;
    border: solid 1px #ccc;
    padding: 0px;
    margin-bottom: 10px;
    background: #fff;
    float: left !important;
    display: inline-block;
    position: relative; /* Swiperを適用するため */
    overflow: hidden; /* はみ出し防止 */
}

/* Swiper コンテナのサイズ調整 */
.main_image_eria .swiper-container {
    width: 100%;
    height: 100%;
}

/* Swiper スライドの画像調整 */
.main_image_eria .swiper-slide img {
    width: 350px;
    height: auto;
}

/* Swiper スライドの画像調整 */
.main_image_eria .swiper-slide img {
    width: 100%;
    height: auto;
}

/* ナビゲーションボタンのデフォルトスタイルに戻す */
.main_image_eria .swiper-button-prev,
.main_image_eria .swiper-button-next {
    width: 44px;
    height: 80px; /* ボタンの高さを調整 */
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
    z-index: 10;
    color: #999;
}
.main_image_eria .swiper-button-prev {
    left: 0px;
}

.main_image_eria .swiper-button-next {
    right: 0px;
}

/* Swiperのデフォルト矢印アイコンを表示 */
.main_image_eria .swiper-button-prev::after,
.main_image_eria .swiper-button-next::after {
    display: block;
    font-family: "swiper-icons";
    font-size: 30px; /* アイコンのサイズを調整 */
    line-height: 80px; /* アイコンをボタンの中央に配置 */
    text-transform: none;
    letter-spacing: 0;
    font-variant: normal;
    line-height: 1;
}

.main_image_eria .swiper-button-prev::after {
    content: 'prev';
}

.main_image_eria .swiper-button-next::after {
    content: 'next';
}





.map_eria {
    /*float: left;*/
    /*width: 350px;*/
    width: 100%;
    /* 20161206 */
    margin-top: 20px;
    /*margin-left: 20px;*/
}

p.map_eriaKome {
    clear: left;
    display: inline-block;
    margin-top: 10px;
}

.map_eria_jigyo {
    float: left;
    width: 350px;
    margin-left: 20px;
}

#image_list1,
#image_list2,
#image_list3 {
    width: 320px;
    height: 80px;
    overflow-x: auto;
    overflow-y: hidden;
}

.list_image {
    width: auto;
    height: 80px;
    white-space: nowrap;
}

.details_contents_inbox h3 {
    margin: 10px 0 0 0;
}

.advertisement {
    margin-left: 20px;
}

.table_list_1 {
    border: solid 1px #999;
    float: left;
    width: 200px;
}

.table_list_1 .table_th {
    border-bottom: solid 1px #999;
    padding: 5px;
    text-align: center;
}

.table_list_1 .table_td {
    padding: 5px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    height: 70px;
}

.table_list_2 {
    border: solid 1px #999;
    border-left: none;
    float: left;
    width: 150px;
}

.table_list {
    border: solid 1px #999;
    border-left: none;
    width: 200px;
    float: left;
}

.table .table_th {
    border-bottom: solid 1px #999;
    padding: 5px;
    text-align: center;
}

.table .table_td {
    padding: 5px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    height: 60px;
}

/* 基本データのtable 20241225 */
.table_details {
    width: 99%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    font-size: 16px;
    border: 1px solid #dee2e6;
    margin-top: 30px;
}

.table_details th {
    padding: 10px 0 10px 20px;
    text-align: left;
    font-weight: normal;
    border-top: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    width: 200px;
    vertical-align: middle;
    color: #009AAE;
}

.table_details td {
    padding: 10px;
    border-top: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    vertical-align: top;
    width: 300px;
}

/* 奇数行の背景色（白） */
.table_details tr:nth-child(odd) th,
.table_details tr:nth-child(odd) td {
    background-color: #ffffff; /* 白 */
}

/* 偶数行の背景色（薄い水色） */
.table_details tr:nth-child(even) th,
.table_details tr:nth-child(even) td {
    background-color: #f3f9f9; /* 薄い水色 */
}

/* 賃料の値を赤色に */
.table_details .big {
    color: #a50600;
    font-weight: bold;
    font-size: 20px;
}

/* リンクのデザイン */
.table_details a {
    color: #579BDE;
    text-decoration: none;
}

.table_details a:hover {
    text-decoration: underline;
}

/* 賃料の値を赤色に */
.table_details .big {
    color: #a50600;
    font-weight: bold;
    font-size: 20px;
}



/* 建物詳細テーブル */
.table_details_room {
    width: 99%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    font-size: 16px;
    border: 1px solid #dee2e6;
    margin-top: 30px;
}

.table_details_room th {
    text-align: center;
    padding: 10px 0 10px 20px;
    text-align: left;
    font-weight: normal;
    border-top: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    width: 200px;
    vertical-align: middle;
    color: #009AAE;
}


.table_details_room td {
    padding: 10px;
    border-top: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    vertical-align: top;
    width: 300px;
    text-align: center;
}

/* 奇数行の背景色（白） */
.table_details_room tr:nth-child(odd) th,
.table_details_room tr:nth-child(odd) td {
    background-color: #ffffff; /* 白 */
}

/* 偶数行の背景色（薄い水色） */
.table_details_room tr:nth-child(even) th,
.table_details_room tr:nth-child(even) td {
    background-color: #f3f9f9; /* 薄い水色 */
}

table.table_details_room td.bggray {
    background-color: #E0E0E0;
}










/*詳細ページ用にお得なサービスの幅を調整　20151008*/

#detail_service_title {
    background: url(../img/detail_title_otoku.gif) no-repeat;
    width: 715px;
    margin-bottom: 10px;
    height: 32px;
    overflow: hidden;
    padding: 0px;
}

.detail_service_title {
    padding: 7px 0 0 35px;
    margin: 0;
    font-size: 16px;
    float: left;
    width: 250px;
}

.detail_title_text {
    float: right;
    width: 420px;
    text-align: right;
    padding-top: 5px;
    font-size: 14px;
}

#detail_service_info2 {
    width: 720px;
    overflow: hidden;
    background: url(../img/detail_service_info_bg.gif) no-repeat;
}

#detail_service_info2 li {
    float: left;
    padding: 10px;
    width: 208px;
    height: 175px;
    margin-right: 12px;
    margin-bottom: 10px;
    position: relative;
    background: #FEFCF0;
    border: #999 1px solid;
    /* Firefox v3.5+ */
    -moz-box-shadow: 2px 2px 3px rgba(153, 153, 153, 0.5);
    /* Safari v3.0+ and by Chrome v0.2+ */
    -webkit-box-shadow: 2px 2px 3px rgba(153, 153, 153, 0.5);
    /* Firefox v4.0+ , Safari v5.1+ , Chrome v10.0+, IE v10+ and by Opera v10.5+ */
    box-shadow: 2px 2px 3px rgba(153, 153, 153, 0.5);
    -ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=2,OffY=2,Color=#80999999,Positive=true)";
    filter: progid: DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color=#80999999, Positive=true);
}

#detail_service_info2 li.no_img {
    background: none !important;
    border: #FFF 1px solid!important;
    box-shadow: none !important;
}

#detail_service_info2 li h3 {
    width: 200px;
    margin: 5px 0!important;
}

#detail_service_info2 li.end {
    float: right;
    width: 208px;
    margin-right: 5px;
    margin-bottom: 0;
}

#detail_service_info2 .left {
    width: 100px;
    height: 100px;
    float: left;
    font-size: 11px;
}

#detail_service_info2 .right {
    width: 100px;
    float: right;
}

#detail_service_info2 .btn_detail {
    bottom: 5px;
    position: absolute;
}

#detail_service_info3 {
    width: 715px;
    overflow: hidden;
    /*  background:url(../img/top_service_info_bg_715.gif) no-repeat;*/
    background: url(../img/top_service_info_bg_715_2020.gif) no-repeat;
}

#detail_service_info3 li {
    float: left;
    padding: 10px;
    width: 208px;
    height: 180px;
    margin-right: 15px;
    margin-bottom: 0;
    position: relative;
    background: url(../img/top_service_info_bg228.gif) no-repeat;
}

#detail_service_info3 li p {
    line-height: 1.5;
}

#detail_service_info3 li.no_img {
    background: none !important;
}

#detail_service_info3 li h3 {
    width: 200px;
    margin: 5px 0!important;
}

#detail_service_info3 li.end {
    float: right;
    width: 208px;
    margin-right: 0px;
    margin-bottom: 0;
}

#detail_service_info3 .left {
    width: 100px;
    height: 100px;
    float: left;
    font-size: 11px;
}

#detail_service_info3 .right {
    width: 100px;
    float: right;
}

#detail_service_info3 .btn_detail {
    bottom: 20px;
    position: absolute;
}

.details_info_text_inbox_02 {
    background: #ecfeff;
    padding: 5px 5px;
}

.details_info_text_inbox_02 h3 {
    padding-top: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    font-size: 16px !important;
    font-weight: normal;
    color: #0A429B;
}








.small {
    font-size: 10px;
}

.other_details {
    width: 740px;
    overflow: hidden;
    margin-bottom: 20px;
}

.other_details .prejudice_housing_one {
    margin-right: 0 !important;
}

#eria_call_number {
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
    clear: both;
}

.call_number {
    color: #c41400;
    font-size: 26px;
    margin: 20px 0;
    font-weight: bold;
    text-align: center;
}

#room_option {
    overflow: hidden;
}

#room_option ul {
    margin: 10px 0;
}

#room_option li {
    float: left;
    margin-right: 20px;
}

#room_option li.end {
    float: right;
}

#list_images {
    width: auto;
    height: auto;
    overflow: auto;
    /*border: solid 1px #ccc;*/
    background: #fff;
    margin-top: 10px;
    padding: 0px;
    display: inline-block;
}

#list_images_01 {
    width: auto;
    float: right;
    height: 350px;
    overflow: auto;
    border: solid 1px #ccc;
    background: #fff;
    padding: 5px;
    overflow: scroll-y;
}

#list_images li {
    float: left;
    margin: 4px;
    display: block;
    border: solid 1px #d5d5d5;
}

#list_images div {
    display: table-cell;
    width: 70px;
    height: 70px;
    text-align: center;
    vertical-align: middle;
    layout-grid-line: 70px;
}

#list_images_01 li {
    float: left;
    margin: 4px;
    border: solid 1px #d5d5d5;
}

#list_images_01 div {
    display: table-cell;
    width: 70px;
    height: 70px;
    text-align: center;
    vertical-align: middle;
    layout-grid-line: 70px;
}

#list_images_jigyo {
    width: 338px;
    height: 140px;
    overflow: auto;
    border: solid 1px #ccc;
    background: #fff;
    margin-top: 10px;
    padding: 5px;
    overflow: scroll-y;
}

#list_images_jigyo li {
    float: left;
    margin: 4px;
    display: block;
    border: solid 1px #d5d5d5;
}

#list_images_jigyo div {
    display: table-cell;
    width: 70px;
    height: 70px;
    text-align: center;
    vertical-align: middle;
    layout-grid-line: 70px;
}


/*-------------search---------------*/

/* 20241210 */

#search_box {
    overflow: hidden;
}

#top_search_box {
    overflow: hidden;
    margin-bottom: 20px;
}

#top_search_box .left_text_box {
    float: left;
    padding-top: 10px;
}

#top_search_box .right_map_btn {
    float: right;
    width: 200px;
    text-align: right;
}

#search_inbox {
    width: 100%;
    margin-bottom: 150px;
}

#search_inbox .check_list {
    overflow: hidden;
    margin-bottom: 10px;
}

#search_inbox .check_list li {
    float: left;
    width: 170px;
}


/* 20241213 */
#search_inbox dd {
    width: 100%;
    padding: 0;
    margin-left: 0px;
    background: #f9f9f9;
}

#search_inbox_01 dd.map {
    width: 715px;
    padding: 10px 0 10px 15px;
    margin-left: 3px;
    border: solid 1px #ccc;
    border-top: none;
    background: #f9f9f9;
}

/* 20241213 絞り込みアコーディオン*/

dt.acco_search_list {
    font-size: 18px;
	font-weight: normal;
	background: #F8F8F8;
    transition: background-color 0.3s ease; /* 背景色のアニメーション */
}

dt.acco_search_list:hover {
	background: #eeeded;
}


/* 20241213 */
.accordion {
    overflow: hidden;
    margin-bottom: 20px;
}

.acco_search_list {
    position: relative; /* 子要素の絶対配置の基準を設定 */
    padding: 10px 20px;
    color: #333;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.acco_search_list .vertical-line {
    display: inline-block;
    width: 5px;
    height: 20px;
    background-color: #00A0C6;
    margin-right: 10px;
}

.acco_search_list .title {
    flex-grow: 1; /* タイトル部分を左揃え */
    text-align: left;
}

.acco_search_list .toggle-icon {
    position: absolute; /* 絶対位置で右端に配置 */
    right: 30px; /* 右端から15px離す */
    top: 50%; /* 高さを中央に配置 */
    transform: translateY(-50%); /* 中央揃えを補正 */
    font-size: 16px;
    color: #00A0C6;
    transition: transform 0.3s ease;
    transform-origin: center center;
    line-height: 1; /* ベースラインの影響を排除 */
    vertical-align: middle; /* アイコンを中央に揃える */
}

.acco_search_list.open .toggle-icon {
    transform: translateY(-50%) rotate(180deg); /* 開閉時に上下逆さまにする */
}

/* 20241217 */
dt.acco_search_list-train {
    font-size: 24px;
	font-weight: normal!important;
	background: #009AAE;
    position: relative; /* 子要素の絶対配置の基準を設定 */
    padding: 5px 20px;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.acco_search_list-train .vertical-line {
    display: inline-block;
    width: 3px;
    height: 36px;
    background-color: #fff;
    margin-left: 20px;
    margin-right: 20px;
}

.acco_search_list-train .title {
    flex-grow: 1; /* タイトル部分を左揃え */
    text-align: left;
}

.acco_search_list-train .toggle-icon {
    position: absolute; /* 絶対位置で右端に配置 */
    right: 30px; /* 右端から15px離す */
    top: 50%; /* 高さを中央に配置 */
    transform: translateY(-50%); /* 中央揃えを補正 */
    font-size: 16px;
    color: #fff;
    transition: transform 0.3s ease;
}

.acco_search_list-train.open .toggle-icon {
    transform: translateY(-50%) rotate(180deg); /* 開閉時に上下逆さまにする */
}











.accordion dd {
    display: flex;          /* Flexboxを有効に */
    flex-direction: column; /* 子要素が縦方向の場合に適用 */
    margin: 0;              /* 余分な余白をなくす */
    padding: 0;             /* 余分なパディングをなくす */
}

.accordion dd .right_box_search_list_1 {
    display: flex;          /* 横並びを明示 */
    flex-wrap: wrap;        /* 折り返しを許可 */
    justify-content: flex-start; /* 左揃え */
    gap: 10px 20px;         /* 間隔調整 */
}

.accordion dd.open {
    display: block;
}

.search_reset_btn {
    overflow: hidden;
}

.search_reset_btn li {
    float: left;
    padding-right: 20px;
}

.search_reset_btn li.end {
    float: right;
}

.acco_serch_list_box {
    width: 720px;
}






.search_list_box_main_bottom {
    overflow: hidden;
    margin-bottom: 20px;
    border: 1px solid #ccc;
    border-top: none;
}

.search_list_box_2024{
    padding: 0 20px;
    font-size: 16px;
}




#search_title_sub {
    border: solid 1px #ccc;
    border-bottom: none;
    background: #f2f2f2;
    padding: 10px;
}

#search_title_sub p {
    border-left: #00339d solid 4px;
    display: block;
    height: 22px;
    padding: 3px 0 0 10px;
    font-size: 24px;
    font-weight: bold;
}


/* 左ボックス */
.left_box_search_list_1,
.left_box_search_list_2,
.left_box_search_list_3 {
    flex: 0 0 220px; /* 固定幅 */
    background-color: #eee;
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #009AAE;
    box-sizing: border-box;
}



/* セクション全体 */
.search_list_box_main,
.search_list_box_main_top {
    display: flex;
    align-items: stretch;
    border: 1px solid #009AAE;
    padding: 0; /* paddingを明示的に設定 */
    box-sizing: border-box;
    position: relative; /* サブピクセル描画を防ぐ */
    border-bottom: none;/* 重なりを防ぐ */
}


/* 20241216 */

p.left_box_title {
    text-align: center;
}


.left_box_title_1 {
    line-height: 40px;
}


/* 親要素の右ボックス設定 */
.right_box_search_list_1 {
    display: flex;            /* Flexboxで横並び */
    flex-wrap: wrap;          /* 折り返しを有効 */
    justify-content: flex-start; /* 左揃え */
    gap: 10px 20px;           /* チェックボックス間の間隔 */
    box-sizing: border-box;   /* パディング含めて幅調整 */
    width: 100%;              /* 幅を100%に設定 */
    padding: 20px 10px;            /* 内側余白 */
}

/* チェックボックスリストを横並びに */
.right_box_search_list_1 ul {
    display: flex; /* Flexboxで横並び */
    flex-wrap: wrap; /* 折り返しを許可 */
    gap: 10px 20px; /* 間隔を調整 */
    padding: 0; /* デフォルトのパディングを削除 */
    margin: 0; /* デフォルトのマージンを削除 */
    list-style: none; /* リストのデフォルトスタイルを削除 */
}

.right_box_search_list_1 li {
    display: flex; /* チェックボックスとラベルを並べる */
    align-items: center; /* 縦中央揃え */
    margin: 0; /* 余計な余白を削除 */
    white-space: nowrap; /* テキスト折り返し防止 */
}

.right_box_search_list_1 input[type="checkbox"] {
    margin-right: 5px; /* チェックボックスとラベルの間隔 */
    transform: scale(1.1); /* チェックボックスのサイズを少し大きく */
}

input[type="checkbox"] {
  transform: scale(1.3); /* 1.5倍に拡大 */
  margin: 5px; /* 余白調整 */
}


/* 賃料セレクトボックスのスタイル */
.right_box_search_list_1 li.hidden {
    display: flex;           /* 横並びにする */
    align-items: center;     /* 縦中央揃え */
    gap: 5px;                /* 要素間の余白 */
    flex-wrap: nowrap;       /* 折り返し禁止 */
    width: 100%;             /* 親要素の幅を全体に広げる */
}

.right_box_search_list_1 li.hidden select,
#change_list dd select {
    width: 120px;            /* セレクトボックスの幅 */
    padding: 5px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
}



/* 賃料セレクトボックスエリア */
.right_box_search_list_1 li.hidden {
    width: 100%; /* 親要素の幅いっぱい */
    display: flex;
    align-items: center; /* 中央揃え */
    gap: 10px; /* セレクトボックス間の余白 */
}

.right_box_search_list_1 li.hidden select {
    width: 120px; /* セレクトボックス幅 */
    padding: 5px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
}




/* その他条件のセクション調整 */
.search_list_box_main_bottom {
    display: flex; /* Flexboxを有効化 */
    border: 1px solid #009AAE; /* セクション枠線 */
    box-sizing: border-box;
    margin-bottom: 20px; /* 余白 */
    align-items: stretch; /* 左右揃え */
}

/* train 20241218 */
.train-search .search_list_box_main_bottom {
    margin-bottom: 0px; /* 余白 */
}

.train-search dl.accordion .kodawari-reset {
    border: 1px solid #009AAE; /* セクション枠線 */
    border-top: none;
}


/* 左側タイトル（その他条件） */
.search_list_box_main_bottom .left_box_search_list_1 {
    flex: 0 0 220px; /* 固定幅 */
    background-color: #eee; /* 背景色 */
    display: flex;
    justify-content: center; /* 中央揃え */
    align-items: center; /* 縦中央揃え */
    border-right: 1px solid #009AAE; /* 区切り線 */
    box-sizing: border-box;
}

/* 右側チェックボックスリスト */
.search_list_box_main_bottom .right_box_search_list_1 {
    flex: 1; /* 残りの幅を全て使用 */
    display: flex;
    flex-wrap: wrap; /* チェックボックスを折り返す */
    gap: 10px 20px; /* チェックボックス間の余白 */
    padding: 10px 15px; /* 内側余白 */
    box-sizing: border-box;
}

/* チェックボックスとラベル */
.search_list_box_main_bottom .right_box_search_list_1 li {
    display: flex;
    align-items: center; /* チェックボックスとラベルを中央揃え */
    margin: 5px 0; /* 上下の余白 */
    white-space: nowrap; /* テキスト折り返し防止 */
}

/* 5. 賃料セレクトボックス: 上下中央揃え */
.right_box_search_list_1 li.hidden {
    display: flex;
    align-items: center; /* 中央揃え */
    gap: 5px; /* 要素間隔 */
    flex-wrap: nowrap; /* 折り返し禁止 */
    width: 100%;
}

#change_list dd select,
.right_box_search_list_1 li.hidden select,
.right_box_search_list_1 li select {
    width: 120px; /* 幅 */
    height: 36px; /* 高さ */
    padding: 5px 30px 5px 10px; /* 内側余白 */
    font-size: 16px; /* 文字サイズ */
    border: 1px solid #ccc; /* 枠線 */
    appearance: none; /* デフォルト非表示 */
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fff;
    
    /* SVGアイコン */
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%230099CC'><polygon points='0,6 10,16 20,6'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center; /* 右から10pxで少し下に */
    background-size: 14px; /* アイコンサイズ */
    box-sizing: border-box;
}


dt.serch_title_list_01 {
    border-bottom: 1px dotted #ccc;
}

/* 20241212 */
div.serch_box_main_01 {
    background: none;
    border: #009AAE 1px solid;
    border-top: none;
}





/* 20241213 */
div.serch_box_in_02 {
    background: none;
    padding: 0px 20px;
    overflow: hidden;
    margin-bottom: 20px;
}

.padding_10 {
    padding-left: 10px;
}

.serch_box_in_02 h3 {/* 20241213 */
    width: 100%;
    padding: 0px 0 5px 0px !important;
    border-bottom: 1px solid #009AAE;
    margin-bottom: 20px;
}

.serch_box_in_02 h3 a{
    font-size: 20px;
    color: #009AAE;
    text-decoration: none;
    font-weight: normal;
}

/*20241213*/
.serch_box_in_02 ul.list {
    display: flex; /* Flexboxを有効化 */
    flex-wrap: wrap; /* 子要素を折り返す */
    gap: 20px; /* 子要素間のスペースを設定 */
    padding: 0 0 0 15px; /* 必要に応じて */
    margin: 0 0 30px 0; /* 必要に応じて */
    list-style: none; /* 必要に応じてリストのデフォルトスタイルを無効化 */
}

.serch_box_in_02 ul.list li {
    flex: 0 0 240px; /* 幅を固定（200px） */
    box-sizing: border-box; /* パディングやボーダーを含めた幅計算 */
}

.serch_box_in_02 ul.list li a {/* 20241213 */
    color: #333;
    font-size: 16px;
}


div.serch_box_in_03 {
    background: none;
    padding: 0px 20px;
    overflow: hidden;
    margin-bottom: 20px;
    width: 1000px;
}

.serch_box_in_03 h3 {/* 20241217 */
    width: 100%;
    padding: 0px 0 5px 0px !important;
    border-bottom: 1px solid #009AAE;
    margin-bottom: 0px;
    font-size: 20px;
    color: #009AAE;
    text-decoration: none;
    font-weight: normal;
}

.serch_box_in_03 h3.tokaikansai {/* 20241217 */
    padding: 0px 0 5px 0px !important;
    border-bottom: none;
    margin-bottom: 20px;
    font-size: 20px;
    color: #333;
}

.serch_box_in_03 ul.list {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 20px!important;
    padding: 0 0 0 15px!important;
    margin: 0 0 30px 0!important;
    list-style: none;
    border: none!important;
}

.serch_box_in_03 ul.list li {
    flex: 0 0 236px!important;
    box-sizing: border-box;
    text-align: left!important;
    padding: 0 0 0 0px!important;
}

.serch_box_in_03 ul.list li a,
dl.accordion dd.search_result_list_box-station ul.list li a {
    display: inline-block;
    padding: 0;
    text-decoration: underline;
    font-weight: normal;
    color: #333;
    font-size: 15px;
}

.serch_box_in_03 ul.list li:hover,
dl.accordion .search_result_list_box-station ul.list li:hover {
    background: none!important;
}

.serch_box_in_03 ul.list li a:hover,
dl.accordion dd.search_result_list_box-station ul.list li a:hover {
    background: none!important;
    text-decoration: none; /* マウスオーバー時にアンダーラインを消す */
}


dl.accordion dd.search_result_list_box-station ul.list {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 20px!important;
    padding: 0 40px 0 40px!important;
    margin: 0 0 30px 0!important;
    list-style: none;
    border: none!important;
}


dl.accordion dd.search_result_list_box-station ul.list li {
    box-sizing: border-box;
    text-align: left!important;
    padding: 0 0 0 15px!important;
    width: 234px;
    margin: 15px 0;
}

.train-search .search_list_box_2024 {
    padding: 0 0px;
    margin: 0;
}

#detail_search{
    width: 100%;
    margin-top: 50px;
}






/* 765px以下のスマホ版調整 */
@media screen and (max-width: 765px) {
    #detail_search {
        width: 100%;
        margin: 20px 20px 0px;
    }
    dl.accordion {
        overflow: hidden;
        height: 100%;
        padding: 0px;
        margin: 0 20px 15px;
    }

    dl.accordion .reset_btn {
        display: flex    ;
        justify-content: center;
        align-items: center;
        padding: 20px;
        background: #E4F0F2;
        border: 1px solid #009AAE;
        border-top: none;
    }

    .acco_search_list .toggle-icon {
        position: absolute;
        right: 30px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 16px;
        color: #fff;
        transition: transform 0.3s ease;
    }

    dl.accordion .reset_btn {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 20px;
        background: #E4F0F2;
    }

    .search_list_box_2024{
        border: 1px solid #009AAE; 
        border-bottom: none;
        padding: 0px;
    }

    #search_inbox {
        width: 100%;
        margin-bottom: 50px;
    }

    .serch_box_in_03 h3 {/* 20250606 */
        padding: 20px 0 5px 0px !important;
    }


    #search_inbox dd {
        background: none;
    }

    #search_inbox dt.acco_search_list {
        font-size: 18px;
        font-weight: normal;
        background: #009AAE;
        color: #fff;
        border: 1px solid #009AAE; 
    }

    .acco_search_list .vertical-line {
        display: inline-block;
        width: 5px;
        height: 20px;
        background-color: #fff;
        margin-right: 10px;
    }


    dt.acco_search_list-train {
        font-size: 18px;
        padding: 5px 20px;
    }

    dt.acco_search_list-train img {
        width: 24px;
    }
        
    .acco_search_list-train .vertical-line {
        display: inline-block;
        width: 2px;
        height: 31px;
        background-color: #fff;
        margin-left: 15px;
        margin-right: 15px;
    }


    .train-search {
        margin-top: 0px !important;
    }



    /* セクション全体 */
    .search_list_box_main,
    .search_list_box_main_top {
        flex-direction: column; /* 上下配置に変更 */
        border: none; /* ボーダーを維持 */
        margin-bottom: 10px; /* 余白調整 */
    }

    .search_list_box_main_bottom {
        flex-direction: column; /* 上下配置に変更 */
        border: none; /* ボーダーを維持 */
        margin-bottom: 0px; /* 余白調整 */
    }

    .search_list_box_main_bottom .left_box_search_list_1 {
        flex: 0 0 0;
        border-right: none;
    }

    /* 左側タイトルボックス */
    .left_box_search_list_1,
    .left_box_search_list_2,
    .left_box_search_list_3 {
        flex: 0 0 auto; /* 幅を自動に変更 */
        background-color: #f8f8f8; /* 背景色をスマホ版に合わせる */
        color: #333; /* 文字色を白に */
        font-size: 16px;
        text-align: center;
        padding: 10px;
        border-right: none; /* 右側ボーダーを削除 */
        box-sizing: border-box;
    }

    /* 右側リストエリア */
    .right_box_search_list_1  {
        padding: 10px;
        margin: 0;
    }
    .right_box_search_list_1 ul {
        display: flex;          /* Flexboxで横並び */
        flex-wrap: wrap;        /* 折り返しを有効にする */
        gap: 10px 10px;         /* チェックボックス間の余白 */
        padding: 0;
        margin: 0;
    }

    .right_box_search_list_1 li {
        flex: 1 1 calc(45% - 10px); /* 2列表示の設定 */
        display: flex;              /* Flexboxでチェックボックスとテキストを並べる */
        align-items: center;        /* 垂直中央揃え */
        white-space: nowrap;        /* テキスト折り返し防止 */
        margin: 5px 0;              /* 上下の余白 */
    }

    /* テキストが長い場合は1列にする */
    .right_box_search_list_1 li span {
        white-space: normal;        /* 折り返しを許可 */
        word-break: break-word;     /* テキストを親要素の幅で折り返す */
    }

    .right_box_search_list_1 li.long-text {
        flex: 1 1 100%;             /* 長いテキスト用に1列表示 */
    }

    /* チェックボックスとテキストの間隔 */
    .right_box_search_list_1 input[type="checkbox"],
    .right_box_search_list_1 input[type="radio"] {
        margin-right: 8px;          /* チェックボックスとテキストの間隔 */
    }


    /* 検索ボタン */
    .search-button {
        width: 100%;
        padding: 12px 0;
        background-color: #009AAE;
        color: #fff;
        font-size: 16px;
        text-align: center;
        border: none;
        border-radius: 4px;
        cursor: pointer;
    }

    .search-button:hover {
        background-color: #007B9A;
    }
    .moving-background-section{
    }

    input[type="checkbox"] {
        transform: scale(1); /* 1.2倍に拡大 */
        margin: 5px; /* 余白調整 */
    }


}

/*---------map------------*/

#map_box {
    overflow: hidden;
    margin-bottom: 20px;
    padding: 0 20px 20px;
    border: solid 1px #009AAE;
    border-top: none;
}

.map_eria {
    width: 100%;
}

.map_box_text {
    float: left;
    padding-top: 15px;
}

#map_search_box p{
    display: flex;
    padding-top: 0px;
    font-size: 18px;
    font-weight: normal;
    margin-bottom: 30px;
    margin-top: 20px;
}

#map_search_box p span{
    color: #009AAE;
}


/* 20161206 */

#detailMap {
    float: left;
    width: 700px;
    margin-right: 10px;
    background: #eee;
}


/* 20161206 */

p.bigger {
    z-index: 999;
}


/* 20161206 */

.mapicon_eria {
    display: inline-block;
    float: right;
    width: 350px;
    /*height: 500px;*/
}

.mapicon_eria ul {}

.mapicon_eria ul li {
    display: inline-block;
    width: 110px;
    height: 110px;
    margin-right: 5px;
    margin-bottom: 7px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.mapicon_eria ul li:hover {
    background: #adc7f5;
}

.mapicon_eria ul li:nth-child(3n+3) {
    margin-right: 0px;
}

.mapicon_eria li a img {
    text-align: center;
    padding-bottom: 5px;
}

.mapicon_eria li a {
    padding-top: 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    width: 100%;
    height: 100%;
}

.mapicon_eria_li_off {
    background: #DFE7F6;
}

.mapicon_eria_li_on {
    background: #adc7f5;
}

/*
#map_details {
    float: right;
    padding: 5px 0 5px 5px;
    width: 280px;
    height: 500px;
    overflow-y: scroll;
    overflow-x: hidden;
    border: solid 1px #ccc;
}
*/
#map_details {/*20250307*/
    float: right;
    width: 280px;
    height: auto;
}

#map_details .prejudice_housing_one{
    float: left;
    border: none;
    /*border-bottom: solid 1px #ccc;*/
    margin-right: 0;
    padding: 15px 10px 15px;
    height: auto;
    border: solid 1px #ccc;
}

#map_details .prejudice_housing_img {
    float: left;
    display: block;
    padding: 20px 0;
    width: 100%;
    height: 100%;
}

#map_details .prejudice_housing_img img {
    width: 100%;
    height: 100%;
}

#map_details .prejudice_housing_one h4 {
    font-size: 16px;
    width: 100%;
    font-weight: bold;
}

#map_details .prejudice_housing_text {
    font-size: 16px;
    float: left;
    clear: left;
    padding: 0px;
    margin-top: 0;
    display: block;
}

/*　20250307　*/
#map_details .prejudice_housing_list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap; /* 横幅が狭くなったら折り返し */
    gap: 10px; /* 各項目の間隔 */
}

#map_details .prejudice_housing_list li {
    display: flex;
    gap: 0px;
    align-items: center; /* テキストの高さを揃える */
    font-size: 14px;
}

#map_details .prejudice_housing_list .label {
    font-weight: bold;
    min-width: 60px; /* ラベルの幅を統一 */
}

#map_details .prejudice_housing_list .value {
    flex-grow: 1; /* 値部分を可変幅に */
}





.prejudice_housing_map {
    width: 270px;
    overflow: hidden;
    margin-bottom: 15px;
}

.prejudice_housing_map_text {
    width: 150px;
    float: left;
    padding-left: 10px;
    display: block;
}

.prejudice_housing_map_text dt.map_title {
    float: left;
    width: 50px;
}

.prejudice_housing_map_text dd.map_text {
    height: 20px;
    width: 60px;
}

.zoom_eria {
    /*width: 100%; 20250516*/
    display: flex;
    flex-wrap: wrap;
    /*justify-content: space-between; 20250516*/
    list-style: none;
    padding: 0;
    margin: 0;
}

.zoom_eria li {
    /*flex: 1; 20250516*/
    text-align: center;
    margin-top: 30px;
    margin-right: 10px;
    border: 1px solid #009AAE;
    border-bottom: none;
    background-color: #fff;
    position: relative;
}

.zoom_eria li:last-child {
    margin-right: 0;
}

.zoom_eria li a {
    display: block;
    padding: 10px 0;
    text-decoration: none;
    color: #009AAE;
}

.zoom_eria li a.select {
    background-color: #009AAE!important; /* 背景色 */
    border: 1px solid #009AAE; /* 同じ色のボーダー */
    color: #fff;
    font-weight: bold;
}

/* ホバー時のスタイル */
.zoom_eria li:hover {
    background-color: #009AAE; /* ホバー時の背景色 */
    cursor: pointer;
}

.zoom_eria li:hover a {
    color: #fff; /* ホバー時のテキスト色 */
    font-weight: bold;
}


/*--------------other_contents-----------*/

#other_contents {
    width: 740px;
}

/* 20250410 **/
#other_contents-2024 {
    width: 100%;
    margin-bottom: 100px;
}

#other_contents-2024 h2 {
    font-size: 20px;
    color: #009AAE;
    font-weight: normal;
    width: 100%;
    padding: 0px 0 5px 0px !important;
    border-bottom: 1px solid #009AAE;
    margin-top: 30px;
    margin-bottom: 10px;
}

#other_contents-2024 h6 {
    font-size: 16px;
    font-weight: bold;
    margin: 10px 0 5px;
    color: #5e5e5e;
}

#other_contents-2024 h2:first-of-type {
    margin-top: 0px;
}

#other_contents-2024.privacyPolicy-2024 h2:first-of-type {
    margin-top: 30px;
}

#other_contents-2024 p {
    font-size: 1em;
}


#other_contents p {
    padding: 5px 10px 10px 5px;
    line-height: 18px;
}

#other_contents .right {
    text-align: right !important;
    /*	padding-right:1px;*/
}

.left_and_right {
    overflow: hidden;
    margin-bottom: 30px;
}

.left_and_right .left_box {
    width: 450px;
    float: left;
}

.left_and_right .left_box2 {
    width: 310px;
    float: left;
}

.left_and_right .left_box_01 {
    width: 375px;
    float: left;
}

.left_and_right .right_box {
    width: 290px;
    float: right;
    line-height: 25px;
}

.left_and_right .right_box2 {
    width: 430px;
    float: right;
    line-height: 25px;
}

.left_and_right .right_box_01 {
    width: 360px;
    float: right;
    line-height: 25px;
}

.left_and_right .right_box p {
    line-height: 25px !important;
}

.left_and_right .right_box_01 p {
    line-height: 25px !important;
}

.left_and_right dl {
    overflow: hidden;
    margin-bottom: 10px;
}

.left_and_right dt {
    float: left;
    width: 100px;
    font-weight: bold;
}

.left_and_right dd {
    float: left;
    width: 620px;
}

.right_box ul {
    margin-left: 10px;
}

.right_box li {
    list-style-type: square;
    padding-bottom: 5px;
}

.right_box_01 li {
    list-style-type: square;
    padding-bottom: 5px;
}

.lease_term_index_search {
    margin: 10px;
    text-align: center;
}

.lease_term_index_search .text_box {
    width: 350px;
}

.lease_term_index_search h2 {
    float: left;
    padding-left: 100px;
    font-size: 16px;
    font-weight: normal;
}

.aiueo_list {
    overflow: hidden;
    margin: auto;
    width: 650px;
}

.aiueo_list li {
    float: left;
    margin-right: 20px;
}

#team_box {
    background: url(../img/team_bottom.gif) no-repeat;
    background-position: center bottom;
    height: 100%;
    width: 740px;
    padding-bottom: 10px;
    margin: 10px 0;
}

#team_box h2.title {
    background: url(../img/team_head.gif) no-repeat;
    height: 28px;
    width: 710px;
    font-size: 16px;
    font-weight: bold;
    padding: 16px 0 0 30px;
    margin: 0;
}

#team_tab {
    font-size: 16px;
    font-weight: bold;
    border-bottom: solid 1px #C7C7C7;
}

#team_tab li {
    background: url(../img/team_icon.gif) no-repeat #F9F9F9;
    color: #000;
    border: solid 1px #C7C7C7;
    border-bottom: none;
    margin: 0 5px 0 0;
}

#team_tab li a {
    width: 130px;
    height: 34px;
    padding: 0 0 0 10px;
}

#team_tab a#tab-link-1,
#team_tab a#tab-link-2,
#team_tab a#tab-link-3,
#team_tab a#tab-link-4,
#team_tab a#tab-link-5 {
    color: #000;
}

#team_tab a#tab-link-1:hover,
#team_tab a#tab-link-2:hover,
#team_tab a#tab-link-3:hover,
#team_tab a#tab-link-4:hover,
#team_tab a#tab-link-5:hover {
    background: url(../img/team_icon_f2.gif) no-repeat #EDEDED;
}

#team_tab_box {
    height: 27px;
    width: 740px;
    margin: 10px 0;
}

.team_tab_bt {
    border-top: solid 1px #C7C7C7;
}

#team_tab2 {
    font-size: 16px;
    font-weight: bold;
}

#team_tab2 li {
    background: url(../img/team_icon2.gif) no-repeat #F9F9F9;
    color: #000;
    border: solid 1px #C7C7C7;
    border-bottom: none;
    margin: 0 2px 0 3px;
    float: left;
    text-align: center;
}

#team_tab2 li a {
    display: block;
    width: 130px;
    height: 28px;
    padding: 8px 0 0 10px;
    text-decoration: none;
}

#team_tab2 a#tab-link {
    color: #000;
}

#team_tab2 a#tab-link:hover {
    background: url(../img/team_icon2_f2.gif) no-repeat #EDEDED;
}

#team_box h3 {
    font-size: 14px;
    font-weight: bold;
}

.team_text_box {
    background: url(../img/team_middle.jpg) repeat-y;
    padding: 16px 0 0 30px;
}

.team_text_box div.page_top {
    margin: 20px 30px 0 0 !important;
    overflow: hidden !important;
    text-align: right !important;
    width: 700px !important;
}

.other_team_box {
    margin: 55px 0 0 0;
}

.other_team {
    background: url(../img/other_team.gif) no-repeat;
    width: 675px;
    height: 19px;
    padding: 2px 0 0 25px;
}

.other_team_box h4 {
    border-left: solid #808080 5px;
    border-bottom: dashed 1px #808080;
    padding-left: 5px;
    margin-left: 15px;
    font-size: 14px;
    margin-bottom: 10px;
    width: 670px;
}

.other_team_box ul {
    margin-left: 35px;
    padding-bottom: 15px;
}

.other_team_box ul {
    margin-left: 35px;
    padding-bottom: 15px;
}

.other_team_box li {
    background: url(../img/team_link_mark.gif) no-repeat;
    background-position: 0px 5px;
    padding-left: 10px;
    padding-top: 3px;
    margin-bottom: 6px;
}

#team_box a:hover {
    text-decoration: none;
}

h3.team_title {
    background: url(../img/team_title.gif) no-repeat;
    width: 600px;
    height: 27px;
    padding: 16px 0 0 50px;
    font-size: 20px !important;
}

.team_text_aria {
    margin-left: 70px;
    font-size: 14px;
    line-height: 1.5em;
    width: 600px;
}

.team_text_aria li {
    list-style-type: circle;
    list-style-position: inside;
}

.office_list_short_cut {
    overflow: hidden;
    margin-bottom: 20px;
}

.office_list_short_cut li {
    float: left;
    padding-right: 20px;
    padding-bottom: 5px\9;
}

.office_list_short_cut li.end {
    float: right;
    padding-right: 0;
    padding-bottom: 5px\9;
}

.office_box {
    background: url("../img/team_bottom.gif") no-repeat scroll center bottom transparent;
    height: 100%;
    margin: 10px 0;
    padding-bottom: 10px;
    width: 740px;
    overflow: hidden;
}

.office_box .left_box {
    float: left;
    width: 330px;
    margin-left: 10px;
}

.office_box .right_box {
    float: right;
    width: 350px;
    margin-right: 10px;
}

.office_box dl {
    overflow: hidden;
    margin-bottom: 20px;
}

.office_inbox {
    background: url(../img/team_middle.jpg) repeat-y;
    padding: 16px 0 0 10px;
    overflow: hidden;
}

.office_box h3 {
    background: url(../img/team_head.gif) no-repeat !important;
    height: 28px !important;
    width: 710px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    padding: 16px 0 0 30px !important;
    margin: 0 !important;
}

.office_box dt {
    float: left;
    width: 80px;
    height: 50px;
    padding-top: 20px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    display: table-cell;
    vertical-align: middle;
    border-bottom: 3px solid #a5a5a5;
    border-right: 1px dashed #c2c2c2;
}

.office_box dd {
    float: left;
    width: 250px;
    height: 60px;
    font-size: 14px;
    border-bottom: 3px solid #d6d6d6;
    padding-left: 10px;
    padding-bottom: 10px;
}

.office_box dd.one {
    float: left;
    width: 230px;
    height: 30px;
    font-size: 14px;
    border-bottom: 3px solid #d6d6d6;
    padding-left: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
}

#other_contents_inbox {
    width: 740px;
    /*padding: 20px;*/
}

ul.pdf {
    margin: 0 0 0 20px;
}

ul.pdf li {
    background: url(../img/pdf_mark.jpg) no-repeat;
    padding: 0 0 0 20px;
    height: 24px;
    margin-bottom: 10px;
}

ul.option_move {
    overflow: hidden;
    margin-left: 15px;
    margin-bottom: 15px;
}

ul.option_move li {
    background: url(../img/yamato_icon.gif) no-repeat;
    padding: 0 0 0 25px;
    height: 24px;
    margin-bottom: 5px;
    width: 300px;
    float: left;
}

ul.supplement {
    margin-left: 15px;
    font-size: 12px;
}

ul.friend_meeting_top_list {
    overflow: hidden;
}

p.friend_meeting_kiyaku {
    text-align: center;
    margin-top: 20px;
}

ul.friend_meeting_top_list li.left {
    width: 350px;
    float: left;
    height: 200px;
    margin-left: 10px;
    margin-bottom: 20px;
}

ul.friend_meeting_top_list li p {
    height: 70px;
    background-color: #fefcf0;
}

ul.friend_meeting_top_list p.f_m_link {
    height: 20px;
    text-align: right;
}

ul.friend_meeting_top_list li.right {
    width: 350px;
    float: right;
    height: 200px;
    margin-right: 10px;
    margin-bottom: 20px;
}

.urgent_support_list {
    overflow: hidden;
}

.urgent_support_list li.inbox {
    float: left;
    width: 230px;
    margin-right: 25px;
}

.urgent_support_list li.inbox_end {
    float: right;
    width: 230px;
}

.urgent_support_list li h4 {
    background: url(../img/urgent_support_list_h4.gif) no-repeat;
    border-bottom: none !important;
    text-align: center;
    border-left: none !important;
    padding: 10px 0 0 0 !important;
    background-color: #fefcf0;
    width: 230px !important;
    height: 25px !important;
    margin: 0 !important;
}

ul.urgent_support_list_inbox {
    width: 220px;
    padding: 0 0 0 10px;
    background-color: #fefcf0;
}

ul.urgent_support_list_inbox {
    height: 60px;
}

ul.urgent_support_list_inbox li {
    background-color: #fefcf0;
    list-style-type: disc;
    list-style-position: inside;
}

.urgent_support_list dl {
    background-color: #fefcf0;
}

.urgent_support_list dt {
    background-color: #fefcf0;
    background: url(../img/urgent_support_list_h4.gif) no-repeat;
    height: 30px;
    text-align: center;
    width: 230px;
    padding-top: 10px;
    font-size: 15px;
    font-weight: bold;
}

.urgent_support_list dd {
    padding: 0 10px 10px 10px;
    height: 100px;
}

.trouble_price {
    width: 350px;
}

.trouble_price th.fast {
    width: 130px;
}

.trouble_price th {
    background-color: #898989;
    border: solid 1px #999;
    color: #fff;
    padding: 5px;
    vertical-align: middle;
}

.trouble_price td {
    border: solid 1px #999;
    text-align: center;
    padding: 10px;
    vertical-align: middle;
}

.trouble_price td.fast {
    text-align: left;
}

.trouble_price td.end {
    color: #ca5152;
    font-size: 18px;
    font-weight: bold;
}

.sp_servie_contents {
    overflow: hidden;
    width: 740px;
}

.sp_service_title_01 {
    background-color: #f39700 !important;
    color: #fff !important;
    border: none !important;
    padding: 5px 5px 5px 15px !important;
}

.sp_service_in_title_01 {
    border-bottom: #f39700 solid 3px;
    font-size: 15px;
    font-weight: normal;
}

.sp_service_in_title_02 {
    border-bottom: #91c42e solid 3px;
    font-size: 15px;
    font-weight: normal;
}

.sp_service_title_02 {
    background-color: #91c42e !important;
    color: #fff !important;
    border: none !important;
    padding: 5px 5px 5px 15px !important;
    margin-top: 20px;
}

.sp_service_in_title_03 {
    border-bottom: #66c3f1 solid 3px;
    font-size: 15px;
    font-weight: normal;
}

.sp_service_title_03 {
    background-color: #66c3f1 !important;
    color: #fff !important;
    border: none !important;
    padding: 5px 5px 5px 15px !important;
    margin-top: 20px;
}

.sp_service_in_title_04 {
    border-bottom: #ec9a74 solid 3px;
    font-size: 15px;
    font-weight: normal;
}

.sp_service_title_04 {
    background-color: #ec9a74 !important;
    color: #fff !important;
    border: none !important;
    padding: 5px 5px 5px 15px !important;
    margin-top: 20px;
}

.sp_service_in_title_05 {
    border-bottom: #f5be00 solid 3px;
    font-size: 15px;
    font-weight: normal;
}

.sp_service_title_05 {
    background-color: #f5be00 !important;
    color: #fff !important;
    border: none !important;
    padding: 5px 5px 5px 15px !important;
    margin-top: 20px;
}

.sp_servie_contents ul {
    width: 710px;
    margin-left: 20px;
}

.sp_servie_contents li.left {
    width: 335px;
    float: left;
}

.sp_servie_contents li.right {
    width: 335px;
    float: right;
}

.sp_servie_contents .image_left_box {
    float: left;
    width: 200px;
    padding-top: 10px;
}

.sp_servie_contents .text_right_box {
    float: right;
    width: 125px;
    padding-top: 10px;
    padding-left: 10px;
    position: relative;
}

.sp_servie_contents dl {
    border: solid 1px #898989;
    position: absolute;
    top: 90px;
}

.sp_servie_contents dt {
    background-color: #898989;
    text-align: center;
    color: #fff;
}

.sp_servie_contents dd {}

.sp_servie_contents dd p {
    padding: 5px !important;
}

.sp_servie_contents dd p.price {
    color: #ca5152;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

.concierge_service_list {
    overflow: hidden;
    width: 720px;
    margin-left: 20px;
}

.concierge_service_list li {
    overflow: hidden;
    width: 230px;
    height: 300px;
    margin-right: 10px;
    margin-bottom: 20px;
    float: left;
}

.concierge_service_list li h4 {
    overflow: hidden;
    width: 220px !important;
    margin: 0 !important;
    padding: 10px 0 !important;
    text-align: center;
    color: #c65e63;
    border-bottom: 2px dotted #999 !important;
    border-top: 2px dotted #999 !important;
    border-left: none !important;
}

.concierge_service_list p.images_box {
    padding: 5px 0 0 0 !important;
}

.concierge_service_list p.text_box {
    background-color: #fefcf0;
    width: 200px;
    height: 65px;
    margin-top: 10px;
}

.right_box_01 .number_list li {
    list-style-type: decimal;
}

.insurance_expense {
    overflow: hidden;
}

.insurance_expense li {
    float: left;
    width: 235px;
    margin-right: 10px;
    margin-bottom: 15px;
}

.insurance_expense dt {
    background-color: #036db9;
    font-size: 16px;
    color: #fff;
    text-align: center;
    padding: 5px;
    -moz-border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    /*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
}

.insurance_expense dd {
    border: solid 1px #036db9;
    background-color: #e8fbff;
    padding: 5px;
    height: 110px;
}

.insurance_expense h4 {
    width: 230px !important;
    color: #003f98;
    font-size: 16px;
    border: none !important;
}

.insurance_expense p.left_text {
    float: left;
    width: 100px;
    padding: 0 !important;
    line-height: 1.6em !important;
}

.insurance_expense .right_image {
    float: right;
    width: 110px;
}

.insurance_price_list {
    border: 1px solid #999;
    text-align: center;
    width: 730px;
    margin-bottom: 30px;
}

.insurance_price_list th {
    font-size: 16px;
    vertical-align: middle;
    background-color: #deeaf7;
    border: 1px solid #999;
    padding: 10px;
}

.insurance_price_list td {
    vertical-align: middle;
    border: 1px solid #999;
    padding: 10px;
    font-size: 16px;
}

.insurance_price_list .s_font {
    font-weight: normal;
    font-size: 9px;
}

.insurance_outline {
    border: solid 1px #999;
    width: 720px;
    margin-left: 10px;
}

.insurance_outline th {
    border: solid 1px #999;
    background-color: #4c4397;
    color: #fff;
}

.insurance_outline_01 {
    background-color: #fffde4;
    background-color: #e5e3f1;
}

.insurance_outline_01_title {
    background-color: #4c4397;
    vertical-align: middle;
    font-weight: bold;
    text-align: center;
    font-size: 14px;
    color: #fff;
}

.insurance_outline_02 {
    background-color: #f6f6fa;
    background-color: #e5e3f1;
}

.insurance_outline_02_title {
    background-color: #4c4397;
    vertical-align: middle;
    font-weight: bold;
    text-align: center;
    font-size: 14px;
    color: #fff;
}

.insurance_outline_03 {
    background-color: #fdede4;
    background-color: #e5e3f1;
}

.insurance_outline_03_title {
    background-color: #4c4397;
    vertical-align: middle;
    font-weight: bold;
    text-align: center;
    font-size: 14px;
    color: #fff;
}

.insurance_outline_04 {
    background-color: #f6f8e3;
    background-color: #e5e3f1;
}

.insurance_outline_04_title {
    background-color: #4c4397;
    color: #fff;
    vertical-align: middle;
    font-weight: bold;
    text-align: center;
    font-size: 14px;
}

.insurance_outline_04_title_01 {
    font-size: 14px;
    text-align: center;
    vertical-align: middle;
}

.insurance_outline td {
    border: solid 1px #999;
}

.comensation_system_link {
    text-align: right;
    padding-right: 30px !important;
    height: 20px;
    width: 700px;
}

.rental_box dl {
    overflow: hidden;
    margin-left: 20px;
    width: 700px;
    border-top: 1px solid #2fa395;
}

.rental_box dt {
    float: left;
    width: 150px;
    background-color: #2fa395;
    color: #f8d720;
    padding: 15px 0;
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    height: 20px;
    margin-bottom: 10px;
}

.rental_box dd {
    float: left;
    width: 538px;
    height: 39px;
    padding: 5px;
    background-color: #d9e8ea;
    border: 1px solid #2fa395;
    border-top: none;
    margin-bottom: 10px;
}

ul.margin-left {
    margin-left: 20px;
    margin-bottom: 40px;
}

.rental_box table {
    width: 700px;
    margin-left: 20px;
    margin-bottom: 10px;
}

.rental_box table th {
    border: 1px solid #999;
    background-color: #2fa395;
    color: #f8d720;
    vertical-align: middle;
    padding: 5px 0;
}

.rental_box table td {
    border: 1px solid #999;
    vertical-align: middle;
    padding: 5px;
}

#contanct_box {
    background: url(../img/contact_form_bg_03.gif) no-repeat;
    background-position: left bottom;
    margin: 0 0 50px 0;
    padding-bottom: 10px;
}

#contanct_in_box {
    background: url(../img/contact_form_bg_02.gif) repeat-y;
    margin: 0;
    padding: 0;
}

#contact_01 {
    background: url(../img/contact_form_bg_01.gif) repeat-y !important;
    color: #515151;
    padding: 15px 0 0 60px !important;
    height: 32px !important;
    margin: 0 !important;
}

#contanct_box table {
    margin-left: 20px;
    width: 660px;
}

#contanct_box table th {
    width: 180px;
    vertical-align: middle;
    text-align: center;
    padding: 15px 0;
    border: 1px solid #ccc;
    font-size: 15px;
    background: #edf7ff;
}

#contanct_box table th.hissu {
    background: url(../img/cautions_btn_01.png) no-repeat #FF7179;
}

#contanct_box table td.hissu {
    background: #FF7179;
}

#contanct_box table td {
    padding: 15px 8px;
    background: #fff;
    border: 1px solid #ccc;
}

.contact_float_left {
    overflow: hidden;
}

.contact_float_left p {
    float: left;
}

.contact_supplement {
    color: #999;
}

#contanct_box .center {
    text-align: center;
}

.thanks {
    padding: 60px 30px !important;
    line-height: 35px !important;
    font-size: 15px;
    text-align: center;
}
.thanks b {
    font-size: 18px;
}

.thanks_center {
    text-align: center;
}

#login_box {
    width: 960px;
    background: url(../img/login_bg_03.gif) no-repeat;
    background-position: left bottom;
    margin: 20px 0 50px 0;
    padding-bottom: 30px;
}

#login_in_box {
    background: url(../img/login_bg_02.gif) repeat-y;
    margin: 0;
    padding: 0;
}

.login_title {
    background: url(../img/login_bg_01.gif) repeat-y !important;
    color: #515151;
    font-size: 18px !important;
    padding: 15px 0 0 75px !important;
    height: 30px !important;
    margin: 0 !important;
}

#login_form {
    overflow: hidden;
}

.login_form_01 {
    width: 410px;
    background: url(../img/login_bg_06.png) no-repeat;
    background-position: left bottom;
    padding-bottom: 20px;
    margin-top: 30px;
    margin-left: 30px;
    float: left;
}

.login_form_02 {
    width: 410px;
    background: url(../img/login_bg_06.png) no-repeat;
    background-position: left bottom;
    padding-bottom: 20px;
    float: right;
    margin-top: 30px;
    margin-right: 50px;
}

.login_form_03 {
    width: 630px;
    background: url(../img/login_bg_10.png) no-repeat;
    background-position: left bottom;
    padding-bottom: 19px;
    margin: auto;
    margin-top: 40px;
}

.login_form_box_01 {
    background: url(../img/login_bg_05.png) repeat-y;
    margin: 0;
    padding: 15px;
}

.login_form_box_02 {
    background: url(../img/login_bg_05.png) repeat-y;
    margin: 0;
    padding: 15px;
}

.login_form_box_03 {
    background: url(../img/login_bg_09.png) repeat-y;
    margin: 0;
    padding: 15px;
}

.login_form_title_01 {
    background: url(../img/login_bg_07.png) repeat-y !important;
    color: #fff;
    font-size: 18px !important;
    padding: 20px 0 0 60px !important;
    height: 25px !important;
    margin: 0 !important;
}

.login_form_title_02 {
    background: url(../img/login_bg_04.png) repeat-y !important;
    color: #000;
    font-size: 18px !important;
    padding: 20px 0 0 60px !important;
    height: 25px !important;
    margin: 0 !important;
}

.login_form_title_03 {
    width: 610px !important;
    background: url(../img/login_bg_08.png) repeat-y !important;
    color: #000;
    font-size: 18px !important;
    padding: 22px 0 0 0!important;
    text-align: center;
    height: 23px !important;
    margin: 0 !important;
}

.login_form_title_04 {
    width: 610px !important;
    background: url(../img/login_bg_11.png) repeat-y !important;
    color: #fff;
    font-size: 18px !important;
    padding: 22px 0 0 0!important;
    text-align: center;
    height: 23px !important;
    margin: 0 !important;
}

.error_text_eria {
    margin: auto;
    width: 480px;
    background-color: #ffdddd;
    border: solid 1px #ff0000;
    color: #ff0000;
    padding: 15px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.error_text_eria2 {
    margin: auto;
    width: 390px;
    background-color: #ffdddd;
    border: solid 1px #ff0000;
    color: #ff0000;
    padding: 15px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.error_text_eria3 {
    margin: auto;
    width: 345px;
    background-color: #ffdddd;
    border: solid 1px #ff0000;
    color: #ff0000;
    padding: 15px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.login_form_tilte02 {
    background: url(../img/login_bg_04.gif) repeat-y !important;
    color: #515151;
    font-size: 18px !important;
    padding: 15px 0 0 75px !important;
    height: 30px !important;
    margin: 0 !important;
}

.login_form_tilte03 {
    background: url(../img/login_bg_04.gif) repeat-y !important;
    color: #515151;
    font-size: 18px !important;
    padding: 15px 0 0 75px !important;
    height: 30px !important;
    margin: 0 !important;
}

.login_form_box_01 table {
    padding: 5px;
    margin-left: 10px;
    width: 350px;
}

table.center_margin {
    margin-left: 120px;
}

table.table_login tr {
    background-color: #f4f4f4;
    border-bottom: solid 7px #fff;
}

table.table_login th {
    padding: 10px;
    width: 100px;
}

table.table_login td {
    padding: 10px;
}

.login_form_box_01 .padding-left {
    padding-left: 80px;
}

.login_form_box_01 .center {
    text-align: center;
}

.login_form_box_01 ul {
    margin-left: 10px;
    margin-top: 20px;
}

.login_form_box_01 li {
    padding-bottom: 10px;
}

.registration {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
}

.resistration_text {
    margin: 20px;
    line-height: 30px;
}

div.scroll_eria {
    width: 550px;
    height: 150px;
    margin: 0 15px 30px 15px;
    background-color: #ffffff;
    border: 1px #c0c0c0 solid;
    color: #000000;
    overflow: auto;
}

h4.scroll_eria_title {
    width: 530px !important;
    background-color: #fcfcfc;
    border: 1px #c0c0c0 solid;
    border-bottom: none;
    padding: 5px 10px;
    margin-left: 15px !important;
}

ul.hosoku_eria {
    margin: 10px 0 10px 150px;
    color: #ff0000;
}

ul.hosoku_eria_01 {
    margin: 10px 0 10px 80px;
}

.registration_center {
    width: 600px;
    text-align: center;
}

#freind_meeting_agreement h4 {
    margin-bottom: 5px !important;
}

p.agreement_box_freind {
    margin-left: 20px;
    margin-bottom: 10px;
}

ul.agreement_freind_number1 {
    margin-left: 25px;
    margin-bottom: 20px;
}

.agreement_freind_dl {
    margin-left: 45px;
    overflow: hidden;
}

.agreement_freind_dl dt {
    float: left;
    font-weight: bold;
}

.agreement_freind_dl dt {
    float: left;
    font-weight: bold;
}

.agreement_freind_dd {
    height: 60px;
    float: right;
    width: 630px;
}

.car_title_01 {
    background: url(../img/car_title_01.jpg) no-repeat !important;
    border: none !important;
    color: #fabe00;
    padding: 2px 0 0 40px !important;
    font-size: 18px !important;
    height: 28px !important;
    margin-left: 0 !important;
    margin-bottom: 5px !important;
    width: 320px !important;
}

.car_text {
    font-size: 10px;
}

.car_table {
    width: 720px;
    margin-left: 20px;
    margin-bottom: 10px;
}

.car_table th {
    background: #e7e7e7;
    background: url("../img/table_bg.gif") repeat-x;
    border: solid 1px #c0c0c0;
    text-align: center;
    vertical-align: middle;
    padding: 5px;
}

.car_table td {
    border: solid 1px #c0c0c0;
    text-align: center;
    vertical-align: middle;
    padding: 5px;
}

.car_table_hosoku {
    font-size: 10px;
    margin-left: 40px;
    margin-bottom: 40px;
}

.car_riyo {
    overflow: hidden;
    margin-bottom: 20px;
}

.car_riyo h4 {
    height: 150px !important;
    border-bottom: none !important;
    border-left: solid 6px #0e3962;
    background: #5782ab;
    color: #fff;
    width: 200px !important;
    float: left;
    font-size: 18px !important;
    margin-right: 10px;
    text-align: left;
    padding-top: 10px !important;
}

.car_riyo .big_text {
    font-weight: bold;
}

.car_riyo .right {
    float: right;
    width: 500px;
    height: 160px;
    background: #dfefff;
}

.car_riyo .title_01 {
    background: url(../img/car_riyo_bg_01.jpg) no-repeat;
}

.car_riyo .title_02 {
    background: url(../img/car_riyo_bg_02.jpg) no-repeat;
}

.car_riyo .title_03 {
    background: url(../img/car_riyo_bg_03.jpg) no-repeat;
}

.car_riyo .title_04 {
    background: url(../img/car_riyo_bg_04.gif) no-repeat;
}


/*-----------------------------------side-------------------------------------*/

#side {
    width: 200px;
    height: 100%;
    overflow: hidden;
    float: right;
    padding-right: 15px;
}

#side_role_middle {
    padding-bottom: 10px;
}

#side_role_middle dl {
    margin: 0 0 10px 10px;
    width: 180px;
    border-bottom: 1px dashed #c0c0c0;
}

#side dd {}

#side h2 a {
    text-decoration: none;
}

#side h2 a:hover {
    text-decoration: underline;
}

#side .role_title_01 {
    background: url(../img/title_mame_s.gif) no-repeat;
    height: 20px;
    padding-top: 2px;
    padding-left: 25px;
    font-weight: bold;
    color: #408e69;
}

#side .role_title_01 a {
    color: #408e69;
    text-decoration: none;
}

#side .role_title_01 a:hover {
    color: #408e69;
    text-decoration: underline;
}

#side li {
    padding-bottom: 5px\9;
}

#side_title_01 {
    background: url(../img/title_keiyaku.gif) no-repeat;
    height: 24px;
    padding: 5px 0 0 30px;
    font-size: 15px;
}

#side_title_02 {
    background: url(../img/title_useful.gif) no-repeat;
    height: 24px;
    padding: 0 25px;
    font-size: 15px;
}

#side_title_03 {
    background: url(../img/title_gyousya.gif) no-repeat;
    height: 24px;
    padding: 5px 0 0 30px;
    font-size: 14px;
}

#side_title_04 {
    background: url(../img/title_blog.gif) no-repeat;
    height: 24px;
    padding: 0 25px;
    font-size: 15px;
}

#side_role_top {
    background: url(../img/side_top.gif) no-repeat;
    padding: 5px 10px;
}

#side_role_top_01 {
    background: url(../img/side_top.gif) no-repeat;
    padding: 5px 10px;
}

.side_role_inbox {
    padding: 5px 10px;
}

span.left_text_link {
    text-align: right;
    padding-left: 105px;
}

#side_role_middle {
    background: url(../img/side_middle.gif) repeat-y;
}

#side_role_box {
    background: url(../img/side_bottom.gif) no-repeat scroll center bottom transparent;
    height: 100%;
    margin: 0;
    margin-bottom: 20px;
    padding-bottom: 3px;
    width: 200px;
}

#side form {
    margin: 0 10px 10px;
}

#side h3 {
    width: 200px;
}


/*-------------------------------footer---------------------------------*/

#footer {
    overflow: hidden;
    margin-top: 100px;

}

#group_footer_line_box{
    padding-bottom: 15px;
    box-shadow: 0px 3px 6px 3px rgba(0,0,0,0.16);

}

#footer_top {
    background: #f2f2f2 url(../img/footer_top_bg.png) repeat-x;
}

#footer_top_inbox {
    width: 980px;
    margin: auto;
    padding: 10px 0;
}

#footer_top_inbox h2 {
    background: url(../img/footer_top_h2_bg.png) no-repeat;
    padding: 2px 0 0 35px;
    margin-bottom: 10px;
}

#footer_top_inbox ul {
    overflow: hidden;
    margin-bottom: 25px;
}

#footer_top_inbox a {
    color: #000;
    text-decoration: underline;
}

#footer_top_inbox a:hover {
    color: #999;
    text-decoration: underline;
}

#footer h3 {
    width: 960px;
    margin-bottom: 10px;
    margin-top: 10px;
}

#footer li {
    float: left;
}

#copyright {
    width: 960px;
    margin: auto;
    text-align: center;
    padding: 20px 0 5px;
}

#group_footer_main {
    background-color: #fff;
    color: #808080;
}

#group_footer_main_inbox {
    margin: auto;
}

#group_footer {
  display: flex;
  justify-content: center; /* リンクを中央揃えにする場合 */
  padding: 0;
  margin: 0;
}

#group_footer {
  display: flex;
  justify-content: center;
  padding: 0;
  margin: 0;
}

#group_footer {
  display: flex;
  justify-content: center;
  padding: 0;
  margin: 0;
}

#group_footer li {
  position: relative;
  list-style: none;
  padding: 0 25px; /* 各リストアイテムの左右に余白を追加 */
}

#group_footer li::before {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  height: 60%; /* 縦ラインの高さ */
  width: 1px;
  background-color: #000; /* 縦ラインの色 */
}

/* 最後の li の右側にも縦ラインを追加 */
#group_footer li:last-child::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  height: 60%; /* 縦ラインの高さ */
  width: 1px;
  background-color: #000; /* 縦ラインの色 */
}

#group_footer li a {
  color: #000; /* デフォルトのリンク色 */
  text-decoration: none;
  transition: color 0.3s ease; /* 色の変化を0.3秒かけてゆっくり実行 */
}

#group_footer li a:hover {
  color: #999; /* ホバー時のリンク色 */
}
/*-----clearfix-------*/

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
    display: inline-table;
}


/* Hides from IE-mac \*/

* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}


.group_footer_sp {
    display: none; /* スマートフォン版は非表示 */
}

/* スマートフォン版フッターリストのスタイル */
@media (max-width: 900px) {
    #footer {
        margin-top: 0;
        padding: 20px 20px 10px;
    }

    #group_footer {
        display: none; /* PC版は非表示 */
    }

    .group_footer_sp {
        display: block; /* スマートフォン版は表示する */
        background-color: #fff; /* 背景色 */
        padding: 0; /* パディングを削除 */
        margin: 0; /* マージンを削除 */
        text-align: center; /* テキスト中央揌え */
        box-sizing: border-box; /* パディングとボーダーを幅に含める */
    }

    .group_footer_sp ul {
        padding: 0; /* パディングを削除 */
        margin: 0; /* マージンを削除 */
        list-style: none; /* リストマーカーを削除 */
        display: flex; /* フレックスボックスで横並びにする */
        flex-wrap: wrap; /* 複数行に折り返す */
        overflow: hidden; /* 親要素の枠内に収める */
    }

    /* 「TOPへ戻る」のスタイル */
    .group_footer_sp li.backtop{
        width: 100.25%; /* 「TOPへ戻る」は1列で幅全体を使用 */
        display: block; /* ブロック表示にして幅全体を使用 */
        margin: 0px 0px 0px -1px; /* ボーダー重なりを防ぐためにマイナスマージンを設定 */
    }


    /* 各liのスタイル */
    .group_footer_sp li {
        border: 1px solid #000; /* 黒のボーダー */
        padding: 10px;
        text-align: center; /* テキスト中央揌え */
        box-sizing: border-box; /* パディングとボーダーを幅に含める */
        display: flex; /* フレックスボックスでコンテンツを配置 */
        align-items: center; /* 垂直方向に中央揌え */
        justify-content: center; /* 水平方向に中央揌え */
        margin: -1px 0 0 -1px; /* ボーダー重なりを防ぐためにマイナスマージンを設定 */
        width: calc(50% + 1px); /* 2列レイアウトの幅を設定し、ボーダー幅を調整 */
        box-sizing: border-box; /* パディングとボーダーを幅に含める */
    }

    /* リンク全体をタップできるようにする */
    .group_footer_sp li a {
        display: block; /* リンクをブロック表示にして全体をタップ可能に */
        height: 100%; /* liの高さ全体をカバー */
        width: 100%; /* liの幅全体をカバー */
        color: #333;
        text-decoration: none;
        box-sizing: border-box; /* パディングとボーダーを幅に含める */
    }

    .group_footer_sp li a:hover {
        color: #009AAE; /* ホバー時のリンク色 */
    }

    /* clearfix */
    .group_footer_sp::after {
        content: "";
        display: table;
        clear: both; /* フロートの解除 */
    }

    #copyright {
        display: block;
        width: 100%;
        font-size: 12px;
        color: #666;
        margin-top: 0px;
        text-align: center; /* テキスト中央揌え */
    }

    #group-efforts .group-efforts__catch {
        font-size: 4.5vw!important;
    }
    #group-efforts {
        margin: 0 auto!important;
    }
    #group_footer_line_box{
        padding-bottom: 0px;
        box-shadow: none;

    }

}



/*--------------------共通--------------------*/
.next_btn {
    float: right;
    width: 20px;
    margin: 0;
    padding: 0;
}
.back_btn {
    float: left;
    width: 20px;
    margin: 0;
    padding: 0;
}
.next_btn img,
.back_btn img {
    cursor: pointer;
}
#kinoshita_chooses {
    /*overflow: hidden;*/
    
    margin-top: 15px;
}
input,
select {
    position: relative;
    /*top:2px;*/
}
.list_housing_search {
    overflow: hidden;
    width: 670px;
}
.list_housing_search li {
    float: left;
    margin-right: 25px;
    padding: 0px;
}
#kinoshita_chooses dl {
    margin-bottom: 15px;
}
.page_top {
    text-align: right;
    margin: 20px 30px 0 0;
    width: 740px;
    overflow: hidden;
}
.page_top li {
    height: 25px;
}
span.nothing {
    color: #c4c4c4;
}
.room_arrangement li {
    width: 65px;
}
.disnon {
    display: none;
}
.favorite_str_right {
    color: #ff0000;
    text-align: right;
    font-weight: bold;
    padding-top: 5px;
}
.favorite_str {
    color: #ff0000;
    font-weight: bold;
    margin-top: 10px;
}

/*----------こだわり検索---------*/
.prejudice_info_eria {
    float: left;
    width: 175px;
    padding: 10px;
    height: 120px;
    position: relative;
    margin: 0;
}
.prejudice_housing_eria {
    float: right;
    width: 535px;
    height: 160px;
}
.prejudice_info_eria_more {
    margin-top: 5px;
    position: absolute;
    bottom: 10px;
}
h3.pick_up_title {
    padding: 0 2px 0 0;
    margin: 0 0 2px 0;
    width: 300px !important;
}
.prejudice_housing_img {
    float: left;
    display: block;
    padding: 20px;
}
.prejudice_housing_text {
    font-size: 16px;
    float: left;
    padding-left: 10px;
    display: block;
}
.prejudice_housing_text dl {
    height: 15px;
    width: 100%;
    font-size: 14px;
}
.prejudice_housing_text dt {
    float: left;
    width: 70px;
    height: 20px;
}
.prejudice_housing_text dd {
    float: left;
    width: 100px;
    height: 20px;
}
dl.prejudice_housing_text_dl {
    height: 18px !important;
    /*width: 130px !important; 非表示 */
    border: none !important;
}
dt.prejudice_housing_text_dl {
    float: left !important;
    width: 50px !important;
    height: 17px !important;
    border: none !important;
}
dd.prejudice_housing_text_dl {
    float: left !important;
    width: 80px !important;
    height: 17px !important;
    border: none !important;
}

/*------------------------404--------------------------*/
.center_404 {
    text-align: center;
    width: 980px;
    margin-top: 20px;
}
.link_box_01 {
    width: 220px;
    margin: 10px 10px 10px 10px;
    float: left;
    background: url(../img/link_box_bg.gif) no-repeat;
    height: 300px;
}
.link_box_01 h2 {
    padding-left: 35px;
    font-size: 13px;
    width: 200px;
}
.link_box_01 h3 {
    padding-left: 35px;
    padding-top: 10px;
    font-size: 13px;
    width: 200px;
}
.link_box_01 li {
    width: 200px;
    padding-bottom: 5px;
    padding-left: 10px;
    list-style-type: square;
    list-style-position: inside;
}
.text_404 {
    background-color: #fefcf0;
    border: solid 1px #e1dece;
    padding: 20px;
    margin: 20px;
    font-size: 14px;
}

/*--------------マイページ-----------*/
#my_page {
    overflow: hidden;
}
#my_page_side {
    float: left;
    width: 200px;
    margin: 20px 0 0 20px;
}
#my_page_side_contents {
    background: url(../img/my_page_middle.gif) repeat-y;
}
#my_page_side_bottom {
    background: url(../img/my_page_bottom.gif) no-repeat;
    height: 20px;
}
#my_page_side h2 {
    background-image: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
#my_page_side ul {
    padding: 9px 0 0 15px;
}
#my_page_side li {
    height: 15px;
    border-bottom: 1px dashed #ccc;
    padding: 10px 0;
    width: 170px;
}
#my_page_side li:hover {
    background-color: #fff6b9;
}
#my_page_contents {
    float: left;
    width: 466px;
    margin: 20px 0 0 20px;
}
#my_page_contents_top {
    background: url(../img/my_contents_top.gif) no-repeat;
    height: 10px;
    width: 466px;
}
#my_page_contents_inbox {
    background: url(../img/my_contents_middle.gif) repeat-y;
    min-height: 400px;
    width: 426px;
    padding: 20px;
    color: #404040;
}
#my_page_contents_inbox dl.my_page_top_dl {
    margin-bottom: 25px;
    background-color: #fcfcfc;
}
#my_page_contents_inbox dl.my_page_top_dl dt {
    font-size: 15px;
    font-weight: bold;
    padding: 10px 5px 5px 10px;
    border-bottom: solid 1px #d5d0b4;
}
#my_page_contents_inbox dl.my_page_top_dl dd {
    border-top: solid 1px #686868;
    line-height: 20px;
    padding-left: 15px;
}
#my_page_contents_bottom {
    background: url(../img/my_contents_bottom.gif) repeat-y;
    height: 19px;
    width: 466px;
    margin-bottom: 30px;
}
#my_page_contents_inbox .prejudice_housing_one h3 {
    background-image: none !important;
    border: none;
    font-size: 14px !important;
    padding: 3px !important;
    margin: 0 !important;
    width: 200px !important;
    height: 14px !important;
}
.my_page_check_box {
    float: left;
    width: 20px;
    height: 60px;
    padding-top: 53px;
    border: solid 1px #c0c0c0;
    border-right: none;
    background: #fff;
    border-bottom: solid 2px #c0c0c0;
}
.favorite_housing_one {
    overflow: hidden;
    border-bottom: 1px dashed #ccc;
    margin-top: 10px;
}
.my_page_all_check {
    overflow: hidden;
    margin-bottom: 20px;
}
.my_page_all_check p {
    float: left;
    width: 180px;
    padding-top: 30px !important;
    height: 50px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    background-color: #00399D;
    border: solid 1px #a5a5a5;
}
.my_page_all_check ul {
    float: left;
    width: 220px;
    height: 70px;
    color: #fff;
    text-align: center;
    padding: 10px 0;
    border: solid 1px #a5a5a5;
}
#my_page_contents_inbox .page_n {
    margin-bottom: 10px;
}
.choice_box li {
    margin-bottom: 11px\9;
    margin-bottom: 5px;
}
.favorite_housing_one_nothing {
    overflow: hidden;
    margin-top: 10px;
    border-bottom: 1px dashed #ccc;
    margin-bottom: 10px;
}
.favorite_housing_one_nothing p {
    background: #ff7070;
    padding: 5px;
    color: #fff;
    height: 61px;
}
#my_page_contents_inbox .favorite_search_one h3 {
    background-image: none !important;
    border: none;
    font-size: 15px !important;
    background: url(../img/my_page_search_icon.png) no-repeat !important;
    padding: 0 3px 3px 20px !important;
    margin: 0 0 5px 0 !important;
    width: 200px !important;
    height: 14px !important;
}
.favorite_search_one {
    overflow: hidden;
    border-bottom: 1px dashed #ccc;
    margin-bottom: 10px;
}
#contanct_box .favorite_search_one table {
    border: solid 1px #fdaa4b;
    margin-bottom: 10px;
    width: 424px;
    padding: 0;
    margin-left: 0;
}
#contanct_box .favorite_search_one table th {
    background: #fce7c8;
    text-align: center;
    font-size: 14px;
    padding: 30px 0 30px;
    width: 100px;
}
#contanct_box .favorite_search_one table td {
    padding: 5px;
    width: 324px;
}
.favorite_search_one li {
    float: left;
    padding-right: 10px;
}
.favorite_search_one_btn {
    overflow: hidden;
}
.favorite_search_one_btn li {
    float: left;
    padding-right: 10px;
    margin-bottom: 7px\9;
}
.parsonal_delete_btn {
    text-align: center;
    margin-top: 30px;
}
.parsonal_delete_text {
    text-align: center;
    margin-top: 30px;
    padding: 10px !important;
    background: #ffb7b7;
    border: solid 1px #ff5858;
    color: #ff0000;
    font-size: 16px;
}

/*-----------------contact--------------*/
.cautions {
    color: #ff0000;
    text-align: center;
}
.contact_top_text_eria {
    padding: 20px;
    font-size: 14px;
}
.contact_top_text {
    background: #e8e8e8;
    padding: 10px;
    width: 660px;
    font-size: 14px;
}
.contact_us_center {
    text-align: center;
    padding: 40px 0 !important;
}
#contact_all {
    overflow: hidden;
    width: 740px;
}
#contact_all .left_01 {
    width: 330px;
    float: left;
    margin: 30px 0 0 20px;
}
#contact_all .right_01 {
    width: 330px;
    float: right;
    margin: 30px 20px 0 0;
}
#contact_all .left_01 h3 {
    width: 310px !important;
    background: url(../img/contact_form_top_04.gif) no-repeat !important;
    font-weight: normal;
    height: 22px !important;
    padding: 7px 0 0 20px !important;
    margin: 0 !important;
}
#contact_all .right_01 h3 {
    margin-top: 20px;
    width: 310px !important;
    background: url(../img/contact_form_top_04.gif) no-repeat !important;
    font-weight: normal;
    height: 22px !important;
    padding: 7px 0 0 20px !important;
    margin: 0 !important;
}
#contact_all .text_eria {
    float: left;
    width: 170px;
}
#contact_all .image_eria {
    float: right;
    width: 150px;
}
#contact_all .left_in_box_01 {
    overflow: hidden;
    border: solid 1px #afafaf;
    border-top: none;
    padding: 2px 0;
}
#contact_all .right_in_box_01 {
    overflow: hidden;
    border: solid 1px #afafaf;
    border-top: none;
    padding: 5px 0;
}
.call_contact {
    width: 300px;
    float: left;
    font-size: 12px;
    text-align: center;
}
.call_contact span.red {
    color: #ff0000;
    font-weight: bold;
}

/* 20210310 */
#contact_all2 {
    overflow: hidden;
    width: 740px;
}
#contact_all2 .left_03 {
    width: 330px;
    float: left;
    margin: 20px 0 0 20px;
}
#contact_all2 .right_04 {
    width: 330px;
    float: right;
    margin: 20px 20px 0 0;
}
#contact_all .left_01 h3.support {
    width: 310px !important;
    background: url(../img/contact_form_top_04.gif) no-repeat !important;
    font-weight: normal;
    height: 22px !important;
    padding: 7px 0 0 20px !important;
    margin: 0 !important;
    font-size: 17px;
}

/*----------------------owner 20170126----------------*/
p.owner_top_title {
    text-align: center;
    color: #003a9e;
    font-size: 24px;
    display: inline-block;
    margin-top: 30px;
    margin-left: 180px;
    padding: 15px 0 5px 0 !important;
    border-bottom: #003A9E 3px solid;
}
.owner_top_ul {
    background: url(../img/owner/owner_circle.png) no-repeat !important;
    height: 360px;
    margin: 20px auto;
    margin-left: 60px;
    overflow: hidden;
}
.owner_top_ul li {
    width: 180px;
    height: 120px;
    padding-top: 50px;
    float: left;
    margin-left: 3px!important;
    margin-right: 25px!important;
    text-align: center;
}
.owner_font_bold {
    font-size: 30px;
    font-weight: bold;
}
.owner_font_bold2 {
    font-size: 22px;
    font-weight: bold;
}
.owner_font_bold3 {
    font-size: 25px;
    font-weight: bold;
}
.owner_top_ul li dt {
    font-size: 16px;
    line-height: 25px;
}
.owner_top_ul li dd {
    padding-top: 10px;
    font-size: 10px;
    line-height: 15px;
}
.owner_top_ul li.end2 {
    margin-left: 110px!important;
    margin-right: 50px!important;
}
.owner_top_ul li.end {
    width: 135px;
    height: 139px;
    /*	float: right;*/
}
#owner_info {
    overflow: hidden;
}
#owner_info li.info_01 {
    background: url(../img/owner/owner_kojin.png) no-repeat !important;
    float: left;
    width: 370px;
    height: 314px;
    margin-right: 0px;
}
#owner_info li.info_02 {
    background: url(../img/owner/owner_hojin.png) no-repeat !important;
    float: left;
    width: 370px;
    height: 314px;
}
ul#owner_info li.info_01 p {
    padding-left: 115px;
    font-size: 15px;
    line-height: 20px!important;
    font-weight: bold!important;
}
ul#owner_info li.info_02 p {
    padding-left: 60px;
    font-size: 15px;
    line-height: 20px!important;
    font-weight: bold!important;
}
h4.mt10 {
    margin-top: 10px!important;
}
p.mt30 {
    margin-top: 30px!important;
}
p.mt40 {
    margin-top: 40px!important;
}
p.mt50 {
    margin-top: 50px!important;
}
div.ownermerit {
    display: inline-block;
    width: 720px;
}
div.ownermeritP {
    float: left;
    width: 500px;
    margin-left: 10px!important;
}
p.ownerMerit {
    background: url(../img/owner/owner_maru.png) no-repeat 0px 1px !important;
    padding: 0px!important;
    padding-left: 16px!important;
    padding-bottom: 5px!important;
}
div.ownermeritPt {
    float: right;
}
ul#owner_info dd {
    padding-left: 18px;
    height: 235px;
}
ul#owner_info li {
    padding-top: 20px;
    height: 26px;
    margin-bottom: 5px;
}
#owner_surpport {
    display: inline-block;
}
#owner_surpport li {
    width: 310px;
    margin-left: 30px!important;
    float: left!important;
}
ul.ownerPack {
    width: 700px;
    height: 572px;
    background: url(../img/owner/owner_table.png) no-repeat!important;
}
ul.ownerPack li {
    margin: 0;
    padding: 0;
    padding-left: 240px!important;
    width: 500px;
    display: inline-block;
}
ul.ownerPack li dl {
    float: left;
    width: 240px;
}
ul.ownerPack li dl.pack01 {
    margin-top: 40px!important;
}
ul.ownerPack li dl.pack02 {
    margin-top: 25px!important;
}
ul.ownerPack li dl.pack03 {
    margin-top: 25px!important;
}
ul.ownerPack li dl.pack04 {
    margin-top: 40px!important;
}
ul.ownerPack li dl.pack05 {
    margin-top: 28px!important;
}
ul.ownerPack li dl.pack06 {
    margin-top: 25px!important;
}
ul.ownerPack li dl.pack07 {
    margin-top: 20px!important;
}
ul.owner_system {
    overflow: hidden;
    margin-left: 0px;
}
ul.owner_system li {
    width: 310px;
    float: left;
    padding-left: 40px;
}
p.owner_contact {
    text-align: center;
    color: #003a9e;
    font-size: 24px;
    display: inline-block;
    margin-top: 30px;
    margin-left: 220px;
}
p.owner_contact a:hover {
    opacity: 0.7;
}
h4.owner_system_title {
    background: url(../img/owner_system_title.gif) no-repeat !important;
    border-left: none !important;
    border-bottom: none !important;
    color: #fff;
    font-weight: normal;
    text-align: center;
    margin-left: 0 !important;
    margin-bottom: 5px !important;
    width: 305px !important;
    padding: 5px 0 0 0 !important;
    height: 20px !important;
    font-size: 16px !important;
}
p.owner_top_text_area_01 {
    background: url(../img/owner_top_text_area_01.jpg) no-repeat !important;
    font-size: 22px;
    padding-left: 160px !important;
    padding-right: 30px !important;
    width: 550px;
    padding-top: 25px !important;
    line-height: 32px !important;
    color: #fff;
    font-size: 30px;
    height: 82px;
}
p.owner_top_text_area_02 {
    background: url(../img/owner_top_text_area_02.jpg) no-repeat !important;
    font-size: 22px;
    padding-left: 160px !important;
    padding-right: 30px !important;
    width: 550px;
    padding-top: 25px !important;
    line-height: 32px !important;
    color: #fff;
    font-size: 30px;
    height: 82px;
}
p.owner_top_text_area_03 {
    background: url(../img/owner_top_text_area_03.jpg) no-repeat !important;
    font-size: 22px;
    padding-left: 160px !important;
    padding-right: 30px !important;
    width: 550px;
    padding-top: 25px !important;
    line-height: 32px !important;
    color: #fff;
    font-size: 30px;
    height: 82px;
}
.owner_details_support_01 {
    background: url(../img/owner_support_01.jpg) no-repeat !important;
    width: 550px;
    padding-left: 190px;
    height: 186px;
    margin-bottom: 20px;
}
.owner_details_support_01 dl {
    width: 150px;
    height: 60px;
    float: left;
    margin-right: 15px;
    padding: 5px 10px;
    margin-bottom: 32px;
    text-align: center;
}
.owner_details_support_01 dl dt {
    color: #00339d;
    font-size: 16px;
    padding-top: 2px;
    height: 25px;
}
.owner_details_support_01 dl.end {
    width: 150px;
    height: 60px;
    float: right;
    margin-right: 0px !important;
    padding: 5px 10px;
    margin-bottom: 32px;
    text-align: center;
}
.owner_details_support {
    background: url(../img/owner_support.jpg) no-repeat !important;
    width: 550px;
    padding-left: 190px;
    height: 186px;
    margin-bottom: 20px;
}
.owner_details_support dl {
    width: 150px;
    height: 60px;
    float: left;
    margin-right: 15px;
    padding: 5px 10px;
    margin-bottom: 32px;
    text-align: center;
}
.owner_details_support dl dt {
    color: #5f7200;
    font-size: 16px;
    padding-top: 2px;
    height: 25px;
}
.owner_details_support dl.end {
    width: 150px;
    height: 60px;
    float: right;
    margin-right: 0px !important;
    padding: 5px 10px;
    margin-bottom: 32px;
    text-align: center;
}
.owner_details_merit {
    overflow: hidden;
}
.owner_details_merit .info_01 {
    width: 365px;
    float: left;
    height: 170px;
}

/*.owner_details_merit .info_01_last{
	width: 365px;
	float: left;
	height: 100px !important;
}*/
.owner_details_merit .info_01 p {
    float: left;
    width: 150px;
}
.owner_details_merit .info_01_end p {
    float: left;
    width: 150px;
}
.owner_details_merit .info_01 ul {
    margin-left: 0px;
    list-style-position: inside;
    list-style-type: disc;
    float: right;
    width: 190px;
    font-size: 11px;
}
.owner_details_merit .info_01 ul li {
    margin-bottom: 4px;
}
.owner_details_merit .info_01_end ul {
    margin-left: 0px;
    list-style-position: inside;
    list-style-type: disc;
    float: right;
    width: 190px;
    font-size: 11px;
}
.owner_details_merit .info_01_end ul li {
    margin-bottom: 4px;
}
.owner_details_merit .info_02 {
    width: 365px;
    float: left;
    height: 170px;
}
.owner_details_merit .info_02 ul {
    margin-left: 20px;
    list-style-position: inside;
    list-style-type: disc;
}
.owner_details_merit .info_02 ul li {
    margin-bottom: 10px;
}
.owner_details_merit .info_02_end ul {
    margin-left: 20px;
    list-style-position: inside;
    list-style-type: disc;
}
.owner_details_merit .info_02_end ul li {
    margin-bottom: 10px;
}
.owner_details_merit .info_01 h4.title_01 {
    background: url(../img/owner_details_merit_title.jpg) no-repeat !important;
    border-left: none !important;
    border-bottom: none !important;
    color: #5f7200;
    height: 26px !important;
    width: 336px !important;
    margin-bottom: 5px !important;
    padding: 7px 0 0 20px !important;
}
.owner_details_merit .info_01 h4.title_02 {
    background: url(../img/owner_details_merit_title_01.jpg) no-repeat !important;
    border-left: none !important;
    border-bottom: none !important;
    color: #00339d;
    height: 26px !important;
    width: 336px !important;
    margin-bottom: 5px !important;
    padding: 7px 0 0 20px !important;
}
.owner_details_merit .info_01_end {
    width: 365px;
    float: right;
    height: 170px;
}
.owner_details_merit .info_01_end h4.title_01 {
    background: url(../img/owner_details_merit_title.jpg) no-repeat !important;
    border-left: none !important;
    border-bottom: none !important;
    color: #5f7200;
    height: 26px !important;
    margin-bottom: 5px !important;
    width: 336px !important;
    padding: 7px 0 0 20px !important;
}
.owner_details_merit .info_01_end h4.title_02 {
    background: url(../img/owner_details_merit_title_01.jpg) no-repeat !important;
    border-left: none !important;
    border-bottom: none !important;
    color: #00339d;
    height: 26px !important;
    width: 336px !important;
    padding: 7px 0 0 20px !important;
}
#owner ul.balue_up {
    float: left;
    background: url(../img/balue_up_bg.gif) no-repeat !important;
    width: 292px;
    height: 141px;
    padding: 42px 0 0 15px;
}
#owner ul.balue_up li {
    height: 37px;
}
.balue_up_box {
    overflow: hidden;
    margin-bottom: 25px;
    margin-left: 20px;
}
.balue_up_box .right_box {
    float: right;
    width: 410px;
}
.toti_owner_box_01 {
    overflow: hidden;
}
.toti_owner_box_01 .left {
    float: left;
    width: 310px;
}
.toti_owner_box_01 .right {
    float: left;
    width: 360px;
    line-height: 26px !important;
}
.toti_owner_box_01 .right span {
    font-size: 14px;
    font-weight: bold;
    color: #3d73b8;
}
.toti_owner_box_dl {
    height: 100px;
    width: 220px;
    margin-right: 40px;
    float: left;
    margin-bottom: 20px;
}
.width_big {
    width: 260px;
    height: 120px;
}
.width_big_01 {
    width: 330px;
    height: 120px;
}
.width_big dd {
    width: 248px !important;
    height: 80px !important;
}
.width_big_01 dd {
    width: 318px !important;
    height: 80px !important;
}
.font_color {
    color: #3d73b8;
    font-size: 14px;
}
.toti_owner_box_dl_01 {
    overflow: hidden;
}
.plan_well_01 {
    overflow: hidden;
}
.plan_well_01 p.left_img {
    float: left;
    width: 400px;
}
.toti_owner_box_dl_end {
    float: right;
    margin-right: 0px;
}
.toti_owner_box_dl dt {
    background: url(../img/owner_dl_title.gif) repeat-x !important;
    height: 24px;
    padding-top: 7px;
    text-align: center;
    color: #3d73b8;
    font-size: 15px;
}
.toti_owner_box_dl dd {
    background: #fcfcfc;
    width: 208px;
    height: 55px;
    display: block;
    padding: 5px;
    border: solid 1px #9bbdd0;
}
.plan_well_01 {
    margin-left: 30px;
}
.plan_well_01 h5 {
    background: url(../img/ico_contHead.png) no-repeat !important;
    padding-left: 15px;
    font-size: 15px;
    border-bottom: dotted 1px #ccc;
}
.all_train {
    margin: 5px 0 0 8px;
    display: block;
    padding: 2px 0 0 10px;
    font-size: 13px;
    background: url("../img/news_arrows.gif") no-repeat;
}
.my_page_table {
    width: 420px !important;
    margin-left: 0 !important;
}
.my_page_table th {
    font-size: 15px !important;
    padding: 8px 5px 8px 0 !important;
    text-align: right !important;
    vertical-align: middle !important;
    width: 100px !important;
}
#my_page_title_01 {
    background: url("../img/my_page_top_bg_01.gif") repeat-y !important;
    color: #515151;
    height: 32px !important;
    margin: 0 !important;
    padding: 15px 0 0 60px !important;
}
#mame_area_top {
    background: url("../img/mame_top_title.gif") no-repeat;
    width: 740px;
    height: 80px;
    overflow: hidden;
}
#mame_area_top p.top_text_01 {
    float: left;
    display: block;
    width: 215px;
    height: 60px;
    padding-top: 10px;
    padding-right: 135px;
    text-align: right;
    color: #fff;
    font-size: 13px;
}
#mame_area_top p.top_text_02 {
    float: right;
    width: 360px;
    line-height: 24px !important;
    display: block;
}
#manual_area_top {
    background: url("../img/mame_img/manual_top_title.gif") no-repeat;
    width: 740px;
    height: 80px;
    overflow: hidden;
}
#manual_area_top p.top_text_01 {
    float: left;
    display: block;
    width: 215px;
    height: 60px;
    padding-top: 10px;
    padding-right: 135px;
    text-align: right;
    color: #fff;
    font-size: 13px;
}
#manual_area_top p.top_text_02 {
    float: right;
    width: 360px;
    line-height: 24px !important;
    display: block;
}
#mame_contents_area span.number {
    width: 16px;
    height: 32px;
    padding: 0 8px;
    margin-right: 15px;
    background: #006837;
    display: block;
    float: left;
    color: #fff;
}
#mame_contents_area {
    overflow: hidden;
}
#mame_contents_area h2 {
    background-image: none;
    background: #e6e6e6;
    padding: 0;
    line-height: 32px;
    height: 32px;
    width: 740px;
    margin-bottom: 20px;
}
#mame_contents_area h3 {
    background: url("../img/mame_title_01.gif") no-repeat;
    padding: 15px 0 0 20px;
    width: 720px !important;
    height: 23px;
    color: #006837;
}
#mame_contents_area .left_box {
    width: 400px;
    float: left;
}
#mame_contents_area .right_box {
    width: 320px;
    float: right;
    text-align: center;
    height: 100%;
}
#mame_contents_area p {
    display: inline-block;
}
#mame_contents_area .left_box2 {
    margin-top: 20px;
    width: 400px;
    float: left;
    height: 170px;
}
#mame_contents_area .right_box2 {
    margin-top: 20px;
    width: 300px;
    float: right;
    text-align: center;
    height: 100%;
}
#mame_contents_area .left_box3 {
    margin-top: 20px;
    width: 400px;
    float: left;
    height: 400px;
}
#mame_contents_area .left_box4 {
    margin-top: 20px;
    width: 400px;
    float: left;
    height: 200px;
}
#mame_contents_area .left_box200 {
    margin-top: 20px;
    width: 400px;
    float: left;
    height: 200px;
}
#mame_contents_area .left_box250 {
    margin-top: 20px;
    width: 400px;
    float: left;
    height: 250px;
}
#mame_contents_area .left_box300 {
    margin-top: 20px;
    width: 400px;
    float: left;
    height: 300px;
}
#mame_contents_area .right_box3 {
    margin-top: 20px;
    width: 300px;
    float: right;
    text-align: center;
    height: 100%;
}
#mame_contents_area .box_contetns_01 .left_box {
    width: 350px;
    float: left;
}
#mame_contents_area .box_contetns_01 .left_box p {
    padding-right: 0 !important;
    margin-right: 0 !important;
    width: 350px;
}
#mame_contents_area .box_contetns_01 .right_box p {
    padding-right: 0 !important;
    margin-right: 0 !important;
    width: 350px;
}
#mame_contents_area .box_contetns_01 .right_box {
    width: 350px;
    float: right;
    text-align: left;
    height: 100%;
}
#mame_contents_area .box_contetns_01 h4 {
    border-bottom: none;
    border-left: none;
    padding: 0;
    height: 100%;
    width: 350px;
    margin: 0 0 0 10px;
    font-size: 14px;
}
#mame_contents_area .box_contetns h4.normal {
    border-bottom: none;
    border-left: none;
    padding: 0;
    height: 100%;
    width: 350px;
    margin: 0 0 0 10px;
    font-size: 14px;
}
#mame_contents_area ul.nuber_list {
    color: #e94e58;
    margin-left: 10px;
}
#mame_contents_area ul.nuber_list span {
    background: url("../img/mame_number.gif") no-repeat;
    width: 12px;
    padding-left: 3px;
    height: 15px;
    color: #fff;
    display: block;
    float: left;
}
#mame_contents_area ul.nuber_list li {
    margin-bottom: 4px;
}
#mame_contents_area .box_contetns {
    overflow: hidden;
}
#mame_contents_area .box_contetns_01 {
    overflow: hidden;
}
#mame_contents_area .arrow_list {
    color: #e94e58;
    margin-left: 10px;
}
#mame_contents_area .arrow_list li {
    background: url("../img/mame_arrow.gif") no-repeat;
    padding-left: 15px;
}
#mame_contents_area ul.merit {
    background: url("../img/merit_01.gif") no-repeat #f7fbf2;
    padding-top: 35px;
    padding-bottom: 5px;
    margin-bottom: 10px;
    padding-left: 10px;
}
#mame_contents_area ul.demerit {
    background: url("../img/demerit_01.gif") no-repeat #f2f8ea;
    padding-top: 35px;
    padding-left: 5px;
    padding-bottom: 10px;
    margin-bottom: 20px;
}
#mame_contents_area ul.merit li {
    background: url("../img/mame_arrow_01.png") no-repeat;
    padding-left: 13px;
    padding-bottom: 5px;
}
#mame_contents_area ul.demerit li {
    background: url("../img/mame_arrow_01.png") no-repeat;
    padding-left: 13px;
    padding-bottom: 5px;
}
#mame_contents_area ul.notes_mame_01 {
    overflow: hidden;
    margin-left: 10px;
}
#mame_contents_area ul.notes_mame_01 li {
    margin-bottom: 20px;
}
#mame_contents_area ul.notes_mame_01 span.notes_circle {
    background: url("../img/en_mame_icon.gif") no-repeat;
    color: #fff;
    padding: 1px 9px 2px 6px;
    height: 50px;
    display: block;
    float: left;
}
table.mame_table {
    width: 740px;
}
table.mame_table th {
    background: #ebf4df;
    padding: 5px 20px;
    border: solid 1px #ccc;
    vertical-align: middle;
}
table.mame_table tr.gray th {
    background: #f2f2f2;
}
table.mame_table td {
    padding: 5px;
    border: solid 1px #ccc;
    text-align: center;
    vertical-align: middle;
}
ul.mage_03_navi {
    overflow: hidden;
    margin: 20px 0;
}
ul.mage_03_navi li {
    float: left;
}
#top_beans_info p {
    font-size: 11px;
}

/*-----------------reposer--------------------*/
#reposer_box {}
#reposer_box h3 {
    background: url("../img/reposer_h3_bg.gif") no-repeat;
    height: 28px;
    color: #64553a;
    margin-top: 20px !important;
    padding: 9px 0 0 35px !important;
}
#reposer_box h4 {
    background: url("../img/reposer_h4_bg.gif") no-repeat;
    font-weight: normal !important;
    margin-top: 20px !important;
    color: #64553a;
    height: 23px;
    margin-left: 17px;
    padding: 2px 0 0 25px !important;
    border: none !important;
}
#reposer_box h5 {
    background: url("../img/reposer_h5_bg.gif") no-repeat;
    font-weight: normal !important;
    color: #64553a;
    height: 19px;
    font-size: 14px;
    padding: 5px 0 0 25px !important;
    margin-bottom: 5px;
    border: none !important;
}
#reposer_title {}
#reposer_box ul.reposer_list_top {
    margin: 10px 0 10px 0;
    width: 740px;
    overflow: hidden;
    height: 41px;
}
#reposer_box ul.reposer_list_top li {
    float: left;
    padding-right: 5px;
}
#reposer_box ul.reposer_list_top li.end {
    padding: 0;
    float: right;
}
#reposer_box .table_box {
    border: solid 1px #c4c4c4;
    border-right: none;
    border-bottom: none;
    width: 710px;
    margin-left: 15px;
    overflow: hidden;
}
#reposer_box .table_box dl {
    width: 355px;
    float: left;
    border-bottom: solid 1px #c4c4c4;
}
#reposer_box .table_box dl.wide {
    width: 710px;
    float: left;
}
#reposer_box .table_box dt {
    background: url("../img/table_bg.gif") repeat-x;
    padding: 7px;
    height: 18px;
    text-align: center;
    width: 170px;
    float: left;
    font-weight: bold;
    border-right: solid 1px #c4c4c4;
}
#reposer_box .table_box dd {
    padding: 7px;
    height: 18px;
    text-align: center;
    border-right: solid 1px #c4c4c4;
}
#reposer_box .table_box dl.high dt {
    height: 14px;
    padding: 18px 7px;
}
#reposer_box .table_box dl.high dd {
    height: 36px;
}
#reposer_box .notes {
    margin-left: 20px;
    padding: 5px 0;
}
#reposer_box .option_list {
    overflow: hidden;
    margin-left: 20px;
}
#reposer_box .option_list li {
    width: 340px;
    float: left: padding-right: 20px;
    padding-bottom: 20px;
}
#reposer_box .option_list li.right {
    float: right;
}
#reposer_box .option_list li img {
    float: left;
    width: 200px;
}
#reposer_box .option_list li p {
    float: right;
    width: 120px;
    padding-left: 10px;
}
#reposer_box .option_list li.end {
    width: 200px;
    float: right:
}
#reposer_box .setubi_list {
    overflow: hidden;
    margin-left: 20px;
}
#reposer_box .setubi_list li {
    float: left;
    width: 355px;
    list-style-type: disc;
    list-style-position: inside;
    height: 25px;
}
#reposer_box table {
    margin-left: 20px;
    width: 716px;
    margin-bottom: 50px;
}
#reposer_box table th {
    background: url("../img/table_bg.gif") repeat-x;
    padding: 5px;
    vertical-align: middle;
    border: solid 1px #c4c4c4;
}
#reposer_box table th.width_01 {}
#reposer_box .arrangement_img {
    padding-left: 20px;
}
#reposer_box table td {
    padding: 5px;
    text-align: center;
    vertical-align: middle;
    border: solid 1px #c4c4c4;
}
#reposer_box table tr:hover {
    background-color: #f0e8d7;
}
#reposer_box table.bukken_list {}
#reposer_box table.bukken_list th {
    width: 80px;
}
#reposer_box table.bukken_list td:hover {
    background: #e9d8b9;
}
#reposer_box table.bukken_list td.none:hover {
    background: #fff;
}
#reposer_box table.bukken_list tr.none:hover {
    background: #fff;
}
#reposer_top_cp {
    background: url("../img/reposer_appearance.jpg") no-repeat;
    width: 470px;
    padding-left: 265px;
    padding-right: 5px;
    height: 400px;
}
#reposer_top_cp h3 {
    background: none;
    font-size: 24px;
    line-height: 45px;
    height: 90px;
    color: #404040;
    width: 400px;
}
#reposer_top_cp span {
    padding-left: 50px;
}
#reposer_top_cp p {
    line-height: 25px;
}
#reposer_box .details_box_list {
    overflow: hidden;
    margin-top: 15px;
}
#reposer_box .details_box_list li {
    background: url("../img/reposer_top_box_bg.gif") no-repeat;
    width: 356px;
    height: 171px;
    float: left;
    margin-bottom: 15px;
}
#reposer_box .details_box_list li.right {
    float: right;
}
#reposer_box .details_box_list li h4 {
    background: none;
    font-size: 18px;
    padding: 7px 0 0 10px !important;
    margin-bottom: 5px;
    width: 200px;
    margin-top: 0 !important;
}
#reposer_box .details_box_list li img.left_img {
    width: 148px;
    height: 120px;
    padding: 0 5px;
    float: left;
}
#reposer_box .details_box_list li .text {
    height: 70px;
}
#reposer_box .details_btn {
    text-align: center;
}
#reposer_box .anker_list {
    overflow: hidden;
}
#reposer_box .anker_list li {
    float: left;
}

/*-------------agreement-------------*/
ul.agreement_number li {
    list-style-type: decimal;
    list-style-position: inside;
    padding-bottom: 7px;
}
ul.agreement_number_01 li {
    list-style-type: none;
    margin-left: 15px;
    padding-bottom: 3px;
}
p.agreement_date {
    text-align: right;
    margin-bottom: 60px;
}
p.center_contact_text {
    text-align: center;
    font-size: 18px;
    display: block;
    padding: 10px !important;
    margin-top: 20px;
    background-color: #ffd2d2;
    border: solid 3px #ff5c5c;
}

/*-------------privacy 20230331-------------*/

.privacyPolicyOList {
	margin: 10px 0px 20px;
	padding: 0px 0px 0px 0px;
	color: #5e5e5e;
	font-size: 1em;
	list-style-type: none;
}

.privacyPolicyOList li {
/*	margin: 0 0 0 2em;*/
	margin: 0 0 0 0em;
	padding: 0px;
}

.privacyPolicyDate, .privacyPolicyName {
	margin: 0 23px 23px;
	padding: 0;
	color: #5e5e5e;
	font-size: 1em;
	text-align: right;
}

#other_contents li{
	position:relative;
/*	padding-left:100px;*/
	margin:2px 0;
}

/*  20160906
#other_contents li span{
	border-left:none !important;
	padding:0;
	position:absolute;
	text-align:right;
	left:0px;
	_left:-90px;
	top:-2px;
}
*/

.liSummary {
    margin: 0.6em 0 1.3em;
    display: block;
}

.privacyPolicyOList .privacyPolicyDlist {
	margin: 0 1em 23px;
	padding: 0;
}

.privacyPolicyOList .privacyPolicyDlist dt {
	margin: 1.3em 0 0.2em 0;
	font-weight: bold;
}



.privacyPolicyOList .ddSummary {
	margin-top: 1.3em;
}

.privacyPolicyOListRoman {
	list-style-type: upper-roman;
}

.privacyPolicyOList ul {
	margin-top: 0em;
	margin-left: 1.3em;
	margin-left: 0em;
	list-style-type: none;
}

.privacyPolicy p {
    padding: 5px 10px 0px 10px!important;
    line-height: 18px!important;
}



/*-------------------仲介業者WEB----------------*/
.contractor_web_notes {
    background: url("../img/c_web_notes_bg.gif") no-repeat;
    width: 590px;
    height: 53px;
    margin: 15px 70px;
    test-align: center;
    padding: 7px 5px;
    color: #ba0101;
}
.contractor_web_notes p {
    text-align: center;
    padding: 0 !important;
}
ul.c_web_info_list {
    width: 630px;
    height: 100%;
}
ul.c_web_info_list li {
    display: block;
    width: 700px;
    height: 200px;
    margin-bottom: 15px;
    margin-top: 10px;
    margin-left: 15px;
    border-bottom: #ccc dashed 1px;
    overflow: hidden;
}
ul.c_web_info_list li .c_web_info_list_left_box {
    float: left;
    width: 245px;
    height: 160px;
}
ul.c_web_info_list li .c_web_info_list_right_box {
    float: right;
    width: 380px;
    padding-left: 15px;
    height: 160px;
}
ul.c_web_info_list li .c_web_info_list_right_box dl dt {
    font-weight: bold;
    font-size: 16px;
    padding-bottom: 5px;
}
ul.c_web_info_list li .c_web_info_list_right_box dl dt span.c_web_info_list_number {
    display: block;
    float: left;
    background: url("../img/c_web_flow_number_bg.gif") no-repeat;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    width: 20px;
    height: 19px;
}
ul.c_web_info_list li .c_web_info_list_left_box_notes {
    color: #ba0101;
    padding-top: 7px;
}
ul.contractor_web_login_btn {
    overflow: hidden;
    height: 90px;
    width: 720px;
    margin: 10px 0 30px 0;
    padding-top: 60px;
    background: url("../img/contractor_bg.png") no-repeat;
}
ul.contractor_web_login_btn li.right {
    float: right;
    padding-right: 150px;
}
ul.contractor_web_login_btn li.left {
    float: left;
    padding-left: 150px;
}

/*-------------------家主様WEB----------------*/
#yanushi_top_box {
    overflow: hidden;
}
#yanushi_top_box .left {
    float: left;
    width: 300px;
    height: 116px;
}
#yanushi_top_box .right {
    float: left;
    width: 390px;
    height: 116px;
    padding: 10px 5px;
    line-height: 20px;
}
.yanushi_login_btn {
    text-align: center;
    padding: 20px 0 10px;
}
.yanushi_old {
    text-align: center;
    padding: 0px 0 20px;
}
#yanushi_q_and_a_box h4 {
    background: url("../img/icon_ttl.png") no-repeat scroll 0 0 transparent;
    border-bottom: 1px dotted #AFAFAF;
    font-size: 107%;
    font-weight: bold;
    border-left: none;
    margin: 10px 0 10px 10px;
    padding: 2px 0 5px 15px;
}
#yanushi_q_and_a_box dl {
    padding-left: 25px;
    margin-bottom: 20px;
}
#yanushi_q_and_a_box dt {
    font-size: 14px;
    font-weight: bold;
    color: #2d7cc5;
    padding-bottom: 5px;
}
#yanushi_q_and_a_box dd span.bold {
    font-weight: bold;
    font-size: 14px;
}
#yanushi_q_and_a_box dd {
    margin: 0 0 20px 0;
}
#yanushi_q_and_a_box dd ul {
    padding-left: 10px;
}
#yanushi_q_and_a_box dd ul li {
    padding-bottom: 5px;
}
#yanushi_q_and_a_box dd ul.notes {
    color: #ff0000;
}
.mail_box_yanushi_web {
    padding: 15px;
}
.pass_yanushi_btn {
    text-align: center;
    padding: 15px 0;
}

/*---------------news--------------------*/
#news_box {
    overflow: hidden;
}
#news_box p {
    padding: 5px;
    margin: 0;
}
#news_box h3 {
    padding: 0 !important;
    border: none !important;
    background: none !important;
    margin: 0 !imporntat;
    font-size: 16px;
}
#news_box h4 {
    padding: 0 !important;
    border: none !important;
    background: none !important;
    margin: 0 !imporntat;
    font-size: 14px;
}
#news_box .left_and_right {
    overflow: hidden;
}
#news_box .left_and_right .left {
    float: left;
}
#news_box .left_and_right .right {
    float: left;
}
.width_ver_01 {
    width: 142px !important;
}
.width_ver_02 {
    width: 151px !important;
}
.margin_bottom_01 {
    margin-bottom: 20px !important;
}
#c_y_web_box {
    overflow: hidden;
}
#c_y_web_box .y_box {
    overflow: hidden;
    background: url(../img/c_y_web_bg.gif) no-repeat;
    padding: 10px;
    width: 340px;
    height: 202px;
    float: left;
}
#c_y_web_box .c_box {
    overflow: hidden;
    background: url(../img/c_y_web_bg.gif) no-repeat;
    padding: 10px;
    width: 340px;
    height: 202px;
    float: right;
}
#c_y_web_box .y_box h3 {
    background-image: none;
    width: 320px;
    margin: 0px;
    height: 40px;
    overflow: hidden;
    padding: 0;
}
#c_y_web_box .c_box h3 {
    background-image: none;
    width: 320px;
    margin: 0px;
    height: 40px;
    overflow: hidden;
    padding: 0;
}
#c_y_web_box .y_box h3 img {
    float: left;
}
#c_y_web_box .c_box h3 img {
    float: left;
}
#c_y_web_box .y_box h3 span {
    padding-top: 10px;
    padding-left: 10px;
    display: block;
}
#c_y_web_box .c_box h3 span {
    padding-top: 10px;
    padding-left: 10px;
    display: block;
}
#c_y_web_box .left_box {
    float: left;
    width: 110px;
    padding-top: 25px;
}
#c_y_web_box .right_box {
    float: left;
    width: 200px;
}
#c_y_web_box .right_box p.box {
    height: 95px;
}

/*----------------------BLOG---------------*/
#blog_side {
    width: 200px;
    background: #d6852f;
    padding: 0px;
    color: #fff;
    float: left
}
#blog_side .blog_top {
    overflow: hidden;
    margin-top: 7px;
}
#blog_side .blog_top a {
    color: #fff;
    text-decoration: none;
}
#blog_side .blog_top a:hover {
    color: #fff;
    text-decoration: underline;
}
#blog_side .blog_top p.year_left {
    float: left;
    width: 10px;
    padding-left: 30px;
}
#blog_side .blog_top p.year_right {
    float: right;
    width: 10px;
    padding-right: 30px;
}
#blog_side .blog_top p.year_center {
    float: left;
    text-align: center;
    width: 80px;
}
#blog_side .month {
    overflow: hidden;
}
#blog_side .month .left {
    float: left;
    width: 20px;
    padding-left: 20px;
}
#blog_side .month .right {
    float: right;
    width: 20px;
    padding-right: 20px;
}
#blog_side .month .center {
    float: left;
    width: 80px;
    text-align: center;
    font-size: 18px;
}
#calender {
    overflow: hidden;
    margin-top: 10px;
    padding: 0 9px;
    border-bottom: #D46D00 solid 1px;
}
#calender li {
    width: 26px;
    text-align: center;
    float: left;
    font-size: 11px;
}
#calender .youbi {
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: solid 1px #fff;
    overflow: hidden;
}
#calender .youbi li {
    font-size: 12px !important;
}
#calender .date .other_month {
    color: #c84b00;
}
#calender .date a {
    text-decoration: underline;
    color: #fff;
}
#calender .date a:hover {
    text-decoration: none;
    color: #c9fff9;
}
#calender .date {
    padding-bottom: 20px;
    overflow: hidden;
}
#category {
    border-top: solid 1px #dba164;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-top: 10px;
}
#category h3 {
    width: 100px;
    padding: 0px;
    font-size: 16px;
    color: #fff;
    font-weight: normal;
    background-image: none;
    margin-bottom: 10px;
    height: 20px;
}
#category ul {
    padding-left: 25px;
}
#category ul ul {
    padding-left: 10px;
}
#category ul li {
    background: url("../img/blog_cate_icon.gif") no-repeat scroll 0 0 transparent;
    padding-left: 23px;
    padding-bottom: 5px;
}
#category ul ul li {
    list-style: none;
    padding-left: 0px;
    background-image: none;
}
#category ul a {
    color: #fff;
}
#blog_contents {
    float: left;
    width: 530px;
    padding-left: 10px;
}
#blog_contents .blog_con_page {
    overflow: hidden;
}
#blog_contents .blog_con_page li.left {
    float: left;
}
#blog_contents .blog_con_page li.right {
    float: right;
}
#blog_contents .title {
    border-bottom: solid 2px #d6852f;
}
#blog_contents .title h3 {
    border-left: solid 6px #d6852f;
    background-image: none;
    height: 20px;
    padding: 3px 0 3px 10px;
    margin-bottom: 4px;
}
#blog_back_n {
    width: 530px;
    float: right;
    background: url("../img/blog_back_title.gif") no-repeat;
    margin-bottom: 40px;
}
#blog_back_n h3 {
    float: left;
    width: 300px;
}
#blog_back_n .title_back_0001 {
    overflow: hidden;
    padding-top: 3px;
}
#blog_back_n h3 {
    float: left;
    background-image: none;
    color: #fff;
    font-size: 14px;
    font-weight: normal;
    width: 420px !important;
    padding: 0 0 0 10px !important;
    margin: 0px;
}
#blog_back_n ul.list {
    border: solid 2px #d6852f;
    overflow: hidden;
    padding-bottom: 20px;
}
#blog_back_n ul.list li {
    float: left;
    border-bottom: 1px dashed #C0C0C0;
    padding: 10px 5px;
    width: 490px;
    display: block;
    margin-left: 10px;
}
#blog_back_n ul.list li p.date {
    float: left;
    width: 100px;
}
#blog_back_n ul.list li dl {
    float: left;
}
#blog_back_n ul.list li dl dt {
    float: left;
    width: 120px;
    text-align: center;
}
#blog_back_n ul.list li dl dt.tohoku {
    background: #006fba;
}
#blog_back_n ul.list li dl dt.kanto {
    background: #00a150;
}
#blog_back_n ul.list li dl dt.tokai {
    background: #64b735;
}
#blog_back_n ul.list li dl dt.kansai {
    background: #f29300;
}
#blog_back_n ul.list li dl dt.kyusyu {
    background: #e94f58;
}
#blog_back_n ul.list li dl dt a {
    text-decoration: none;
    color: #fff;
}
#blog_back_n ul.list li dl dd {
    float: left;
}
#blog_contents_box {
    padding: 20px 0px;
    padding-top: 0px;
}
.toko_note {
    overflow: hidden;
    padding: 20px 0;
    width: 530px;
}
.toko_note li {
    width: 530px;
    text-align: right;
}
.toko_note li.fast {
    width: 150px;
    float: right;
}
.toko_note li dt {
    float: left;
    /*	padding-left: 20px;*/
    
    font-weight: bold;
}
.toko_note li dd {
    float: left;
}
#blog_contents_box .top_note {
    overflow: hidden;
}
.note_office_list {
    padding: 15px;
    font-size: 13px;
    background: #ffdede;
    border: solid 2px #ff9c9c;
    display: block;
    margin: 10px 0;
    text-align: center;
}
.note_office_list span.cou {
    font-size: 15px;
}
#internet_free {
    overflow: hidden;
    padding: 3px;
    background: url("../img/internet_free_bg.jpg") no-repeat;
}
#internet_free ul li {
    float: left;
    width: 246px;
    height: 150px;
}
#internet_free ul li dl {
    padding: 5px;
}
#internet_free ul li dt {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
}
#internet_free ul li dd {
    padding-top: 10px;
}
#internet_free ul li.end {
    float: right;
    width: 240px;
}
#internet_free ul span.dl_ttl_001 {
    font-weight: bold;
    color: #2177c8;
}
.help_call_n {
    width: 720px;
    text-align: center;
    margin: 30px 0;
}
.help_call_n dt {
    /*	padding-right: 150px;*/
}
.help_call_n dd {
    font-size: 28px;
    color: #3cae35;
    padding-top: 20px;
    font-weight: bold;
}
.mile_note_box {
    background: #ffdddd;
    padding: 10px;
}
.mile_note_box h3 {
    background-image: none !important;
    padding: 10px 0 !important;
    height: 18px !important;
    margin: 0 !important;
}
.mile_note_box ul {
    padding-left: 10px;
}
.mile_btn_center {
    text-align: center;
    width: 340px;
}

/*----------------------物件の売却をお考えの方---------------*/
#housing_dealing_top_box {
    overflow: hidden;
}
#housing_dealing_top_box .left {
    float: left;
    width: 264px;
    height: 137px;
}
#housing_dealing_top_box .right {
    float: left;
    width: 426px;
    height: 117px;
    line-height: 20px;
    padding-top: 20px;
}
#other_contents h3.housing_dealing_ttl {
    background: url("../img/housing_dealing_03.gif") no-repeat scroll 0 0 transparent !important;
    height: 23px !important;
    color: #fff !important;
    text-align: center !important;
    font-size: 16px !important;
    width: 227px !important;
    padding: 10px 0 0 0 !important;
}
#other_contents h3.housing_dealing_ttl_01 {
    background-image: none !important;
    background: #048a01 !important;
    height: 23px !important;
    color: #fff !important;
    text-align: center !important;
    font-size: 20px !important;
    width: 740px !important;
    padding: 15px 0 5px 0 !important;
    margin-top: 50px !important;
    margin-bottom: 0px !important;
}
#other_contents ul.housing_dealing_box_01 {
    background: #cbf6ff;
    list-style-type: disc;
    padding: 15px;
    list-style-position: inside;
    line-height: 26px;
}
#other_contents .housing_dealing_box_02 {
    border: 1px solid #048a01;
    padding: 20px;
    overflow: hidden;
}
#other_contents .housing_dealing_box_02 dl.left_box {
    float: left;
    width: 300px;
    padding-left: 110px;
}
#other_contents .housing_dealing_box_02 dl.left_box dt {
    float: left;
}
#other_contents .housing_dealing_box_02 dl.left_box dd {
    color: #048a01;
    font-size: 30px;
    font-weight: bold;
    padding-top: 10px;
    padding-left: 30px;
}
#other_contents .housing_dealing_box_02 ul dl {
    overflow: hidden;
}
#other_contents .housing_dealing_box_02 ul dt {
    float: left;
}
#other_contents .housing_dealing_box_02 ul dd {
    float: left;
}
.details_contact_box_01 {
    background: url(../img/details_contact_box.gif) no-repeat;
    padding: 10px;
    overflow: hidden;
    margin: 50px 0;
    height: 222px;
    width: 690px;
}
.details_contact_box_01 .top_box {
    height: 52px;
    padding: 0;
    margin-bottom: 10px;
    text-align: center;
}
.details_contact_box_01 .top_box h3 {
    margin-top: 0px !important;
}
.details_contact_box_01 .right_box {
    float: left;
    width: 330px;
    padding: 10px;
    padding-top: 30px;
    text-align: center;
}
.details_contact_box_01 .right_box .contact_btn {
    padding-left: 20px;
}
.details_contact_box_01 .left_box {
    float: left;
    width: 320px;
    padding: 10px;
    text-align: center;
}
.details_contact_box_01 .left_box .call_number_box {
    font-size: 24px;
    font-weight: bold;
    color: #ff0000;
    padding: 10px 0;
    margin-top: 30px;
}
.h_move {
    overflow: hidden;
}
.top_01_gif {
    text-align: center;
    padding: 20px 0;
}
.h_move .service_list {
    overflow: hidden;
}
.h_move .service_list li {
    float: left;
    width: 350px;
    height: 106px;
    background: #ffddbe;
    margin-bottom: 20px;
}
.h_move .service_list li.end {
    float: right;
}
.h_move .service_list li dt {
    float: left;
    width: 125px;
}
.h_move .service_list li dd {
    float: right;
    width: 220px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    display: table-cell;
    vertical-align: middle;
    line-height: 30px;
    padding-top: 25px;
}
.h_move .service_list li dd.top_01 {
    padding-top: 10px;
}
.h_move .service_list li dd .list_big {
    color: #ff0000;
    font-size: 28px;
}
.h_move table {
    width: 740px;
    margin: 15px 0;
}
.h_move table th {
    border: solid 1px #bababa;
    padding: 5px 10px;
    background: #efefef;
    text-align: center;
    vertical-align: middle;
}
.h_move table td {
    border: solid 1px #bababa;
    padding: 5px 10px;
    text-align: center;
    vertical-align: middle;
}
.flow_move {
    overflow: hidden;
}
.flow_move li {
    float: left;
    width: 230px;
    margin-right: 24px;
}
.flow_move li.end {
    float: right;
    margin-right: 0px;
}
.flow_move dt {
    display: block;
    padding: 5px 0;
    margin-bottom: 3px;
    background: #c9ffbd;
    color: #057103;
    font-size: 16px;
    text-align: center;
    font-weight: bold;
}
.flow_move dd {
    background: #e9ffe4;
    padding: 5px;
    height: 100px;
}
.h_move_contatc {
    overflow: hidden;
}
.h_move_contatc .left {
    float: left;
    width: 365px;
    text-align: center;
}
.h_move_contatc .right {
    float: right;
    width: 365px;
    text-align: center;
}
.h_move_contatc dl {
    padding-top: 30px;
    text-align: center;
}
.h_move_contatc dt {
    font-size: 22px;
    padding-bottom: 15px;
}
.h_move_contatc dd {
    font-size: 30px;
    font-weight: bold;
    color: #12a73b;
}
.b_20 {
    padding-bottom: 20px;
}
#details_contents>div>div:nth-child(1)>div.right>a:hover {
    content: url('/img/btn_reason_on.gif');
}
.friends_left_and_right {
    margin-left: 10px;
}
.left_box_friends {
    height: 160px;
    margin-right: 10px;
    float: left;
}
.left_box_friends {
    float: left;
}

/* 賃貸FAQ 20160511 */
.faq_box {
    margin: 55px 0 0 0;
}
.faq_box h4 {
    border-left: solid #808080 5px;
    border-bottom: dashed 1px #808080;
    padding-left: 5px;
    margin-left: 15px;
    font-size: 14px;
    margin-bottom: 10px;
    width: 670px;
}
.faq_box ul {
    margin-left: 10px;
    padding-bottom: 15px;
}
.faq_box li {
    background: url(../img/faq_link_mark.png) no-repeat;
    background-position: 0px 5px;
    padding-left: 10px;
    padding-top: 3px;
    margin-bottom: 6px;
}

/* -- Accordion -- */
#other_contents h3.faqH3 {
    width: 715px;
    padding: 10px 0 0 25px;
    height: 28px;
    font-size: 18px;
    margin-top: 40px;
    background: url(../img/h3_bg_01.gif) no-repeat;
}
#other_contents .accordion_head,
#profileAccordion .accordion_body {
    border-left: none !important;
    padding: 10px 0 7px 12px;
    margin-top: 5px;
}
#other_contents .accordion_head {
    cursor: pointer;
    border-bottom: 2px solid #FFF;
    position: relative;
    padding-left: 42px;
    font-weight: bold;
    font-size: 16px;
    background: url(../img/faq_link_mark.png) no-repeat #DEDFE3;
    background-position: 7px 12px;
    border-radius: 5px;
}
#other_contents .accordion_head:hover {
    background: url(../img/faq_link_mark.png) no-repeat #CAD8F5;
    background-position: 7px 12px;
}
#other_contents .selected {
    background: url(../img/faq_link_mark.png) no-repeat #CAD8F5;
    background-position: 7px 12px;
}
#other_contents .accordion_head span {
    color: #003A9E;
    font-weight: bold;
    font-size: 18px;
    border-left: none !important;
    padding: 0;
    position: absolute;
    top: 7px;
    left: 20px;
    _left: -240px;
}
#other_contents .accordion_body {
    font-size: 13px;
    padding-left: 35px;
    padding-top: 5px;
}
#other_contents .accordion_body p.answerP {
    padding-left: 15px;
    padding-top: 3px;
}
#other_contents .accordion_body p.answer {
    float: left;
    width: 15px;
    color: #F6911F;
    font-weight: bold;
    font-size: 18px;
    border-left: none !important;
    padding: 0;
    position: relative;
    top: 1px;
    left: -13px;
    _left: -240px;
}
#other_contents li {
    position: relative;
    /*	padding-left:100px;*/
    
    margin: 2px 0;
}

/*  20160906
#other_contents li span{
	border-left:none !important;
	padding:0;
	position:absolute;
	text-align:right;
	left:0px;
	_left:-90px;
	top:-2px;
}
*/

/* トップページとサイドメニュー変更 20160808　*/
#side_title_05 {
    background: url(../img/title_otoku.gif) no-repeat;
    height: 24px;
    padding: 5px 0 0 30px;
    font-size: 15px;
}
#side_otoku dl {
    border: 1px solid #B7AC8B;
    margin-bottom: 10px;
}
#side_otoku dl dd.otokuTxt {
    font-size: 12px!important;
    line-height: 1.5;
    padding: 5px;
}
#side_otoku dl dd.otokuTxt span a {
    font-weight: bold;
    font-size: 16px!important;
    color: #FF931E;
}
#side_otoku dl dd.otokuBtn {
    width: 100%;
    background: #FF931E;
    text-align: center;
}
#side_otoku dl dd.otokuBtn a {
    text-decoration: none;
    color: #FFF;
    display: block;
}

/* こだわり条件　*/
ul.kodawari {
    display: inline-block;
    clear: both;
    /*	margin-bottom: 10px!important;*/
}
ul.kodawari li {
    margin-right: 20px;
    margin-top: 20px;
    width: 355px;
    float: left;
    background: #fff;
    border: 1px solid #cccccc;
    border-radius: 4px 4px 4px 4px;
    /* box-shadow */
    
    box-shadow: 0px 0px 10px 3px #ddd;
    -moz-box-shadow: 0px 0px 10px 3px #ddd;
    -webkit-box-shadow: 0px 0px 10px 3px #ddd;
}
ul.kodawari li:nth-child(2n) {
    margin-right: 0px!important;
}
ul.kodawari li h3 span.kodawariArrow img {
    vertical-align: middle;
}
ul.kodawari li h3.kodawariH3 {
    margin-bottom: 0px!important;
    width: 100%;
    background: #00399D;
}
ul.kodawari li h3.kodawariH3 a {
    padding: 6px;
    text-decoration: none;
    color: #FFF;
    font-weight: bold;
    font-size: 16px;
    display: block;
}
div.kodawariLeft {
    margin-right: 10px;
    float: left;
}
div.kodawariRight {
    line-height: 1.5;
    height: 92px;
    padding: 15px;
}
p.kodawariBtn {
    margin-top: 10px;
}
.mt10 {
    margin-top: 10px!important;
}
.mt20 {
    margin-top: 20px!important;
}
.pt10 {
    padding-top: 10px!important;
}
.pt20 {
    padding-top: 20px!important;
}

/* 2つの特典　*/
ul.tokuten {}
ul.tokuten li {
    margin-bottom: 20px;
    margin-right: 20px;
    height: 300px;
    width: 335px;
    float: left;
    background: #fff;
    border: 1px solid #cccccc;
    padding: 0 10px 10px;
}
ul.tokuten li:nth-child(2n) {
    margin-right: 0px!important;
}
ul.tokuten li h3.tokutenH3 {
    background: url(../img/topServiceH.gif) left top no-repeat;
    height: 50px;
    padding: 0px 0 0 20px;
    font-size: 15px;
    margin-bottom: 0px!important;
    width: 100%;
}
ul.tokuten li h3.tokutenH3 a {
    padding: 15px 10px 10px;
    color: #FF931E;
    font-weight: bold;
    font-size: 18px;
    display: block;
}
ul.tokuten li p.tokutenTxt {
    margin: 10px 0px;
}

/* 豆知識　*/
.top_title_mame {
    padding: 7px 0 0 35px;
    margin: 0;
    font-size: 16px;
    float: left;
    width: 150px;
}
.top_title_mametext {
    float: right;
    width: 550px;
    text-align: right;
    padding-top: 5px;
    font-size: 13px;
}
.top_title_mametext img {
    vertical-align: middle;
}

/* 友の会新ページ　*/
#other_contents ul.friend_meeting_top_list2 {
    margin: 0!important;
    padding: 0!important;
}
#other_contents ul.friend_meeting_top_list2 li.liLeft {
    width: 354px;
    float: left;
    height: 350px;
    margin-bottom: 20px;
}
#other_contents ul.friend_meeting_top_list2 li p {
    /*	height: 70px;
	background-color: #fefcf0;*/
}
#other_contents ul.friend_meeting_top_list2 p.f_m_link {
    font-size: 15px;
    text-align: left;
}
#other_contents ul.friend_meeting_top_list2 p {
    padding: 0!important;
    margin: 0!important;
}
#other_contents ul.friend_meeting_top_list2 li.liRight {
    width: 354px;
    float: right;
    height: 350px;
    padding: 0!important;
    margin-bottom: 20px;
    text-align: left;
}
#other_contents ul.friend_meeting_top_list2 li ul li {
    display: inline-block;
    margin-bottom: 10px;
    height: 90px;
}
#other_contents div.leftPic {
    width: 90px;
    height: 90px;
    float: left;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    padding-right: 10px!important;
}
#other_contents div.rightTxt {
    text-align: left;
}
#other_contents div.rightTxt p.f_m_link {
    margin-bottom: 10px!important;
}
div#cluboffOuter {
    border: 4px solid #00399D;
    display: inline-block;
}
div#cluboffInner {
    padding: 20px;
}
h5.cluboffH5 {
    vertical-align: middle;
    padding: 10px;
    margin-top: 20px;
    background: #00399D;
    font-size: 23px;
    font-weight: bold;
    color: #fff;
}
h5.cluboffH5 span {
    font-size: 14px;
}

/*
div#cluboffInner p{
	padding: 0!important;
	margin: 0!important;
}
*/
div#cluboffInner div.cluboffService p.serviceTxt {
    padding-left: 0px!important;
    margin-top: 10px!important;
}
div.cluboffService {
    width: 100%;
}
div.cluboffService ul.serviceUl {
    display: inline-block!important;
    margin-top: 10px!important;
}
div.cluboffService ul.serviceUl li.serviceli {
    clear: both!important;
    margin-bottom: 10px!important;
    height: 200px;
}
div#cluboffInner div.cluboffService p.leftPic {
    width: 220px!important;
    height: 170px!important;
    float: left!important;
    text-align: left!important;
    vertical-align: middle!important;
    padding-left: 0px!important;
    padding-top: 15px!important;
}
div#cluboffInner div.cluboffService p.rightTxt {
    font-size: 23px;
    padding-left: 0px!important;
    padding-top: 40px!important;
    text-align: left!important;
    display: inline-block!important;
}
div#cluboffInner div.cluboffService ul li p.tokuten {
    font-size: 15px;
    color: #ff0000;
}
div#cluboffInner div.cluboffService p.serviceTl {
    font-size: 18px;
    padding-top: 10px!important;
}
div#cluboffInner div.cluboffService ul li p.caution {
    font-size: 14px;
    padding-top: 5px!important;
}
div#cluboffInner div.cluboffService p.serviceTl span {
    color: #00399D;
}
div.serviceDiv {
    width: 700px;
    display: inline-block!important;
}


/*  Web見学はこちら　20160906  */
p.webKengaku {
    margin-top: 15px;
}
p.webKengaku a img:hover {
    opacity: .6;
}

/*  民法改正に伴う原状回復に関する事項について　20161222  */
#minpoukaisei p {
    padding: 0;
    margin-top: 10px;
    line-height: 1.5;
}
#minpoukaisei p.minpou {
    font-family: 'Noto Sans JP', sans-serif;
    font-style: oblique;
    font-size: 13px;
    border: 1px solid #8d7864;
    color: #8D7864;
    padding: 15px!important;
    margin: 20px 0!important;
}
p.minpou_box {
    margin-left: 20px;
    margin-bottom: 10px;
}
div.minpou_image p.minpou_box {
    margin-left: 5px!important;
}
p.minpou_box span {
    font-weight: bold;
}
p.minpou_box span.red {
    color: red;
}
p.minpou_box span.green {
    color: #478917;
}
p.minpou_box span.brown {
    color: #a64115;
}
p.minpou_box span.blue {
    color: #1484b9;
}
ul.minpou_box_number {
    margin-left: 25px;
    margin-bottom: 20px;
}
ul.minpou_box_number li span {
    font-weight: bold;
}
ul.minpou_box_number li span.red {
    color: red;
}
.minpou_box_dl {
    margin-left: 45px;
    overflow: hidden;
}
.minpou_box_dl dt {
    float: left;
    font-weight: bold;
}
.minpou_box_dl dt {
    float: left;
    font-weight: bold;
}
.minpou_box_dd {
    height: 60px;
    float: right;
    width: 630px;
}
p.mt50 {
    margin-top: 50px!important;
}
p.mb30 {
    margin-bottom: 50px!important;
}
div.minpou_image {
    border: 1px solid #666;
    padding: 20px 40px;
    margin-left: 20px;
    margin-bottom: 10px;
}
#minpoukaisei h5 {
    margin-top: 20px;
    margin-left: 20px;
    background: url("../img/kaisei_h5.png") no-repeat;
    padding: 0 0 5px 15px;
    width: 700px !important;
    border-bottom: #111 1px dotted;
}

/* 20170106 デザイン変更 */
#search_result_housing_list_box {
    margin-bottom: 10px!important;
}
#search_result_housing_list h3 {
    margin-left: 10px!important;
    padding-top: 10px!important;
}
#search_result_housing_list h3 span.h3New {
    padding: 1px 15px;
    background: #e32d2e;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color: #FFF;
    font-size: 14px!important;
    font-weight: normal!important;
}
.change_picture_img2017 {
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    height: 240px;
    width: 240px;
    border: none;
}
#search_result_housing_list .left_box2017 {
    float: left!important;
    width: 245px!important;
    padding: 10px 6px 0 6px!important;
}
#search_result_housing_list .right_box2017 {
    float: right!important;
    width: 448px!important;
    padding: 10px!important;
}
ul.main_list2017 {
    width: 448px;
    overflow: hidden;
}
/* 20241219 */
ul.main_list2017 li {
    width: 100%;
    overflow: hidden;
    border-top: none;
}
ul.main_list2017 li:last-child {
    border-bottom: none;
}

ul.main_list2017 dt {
    width: 70px;
    font-size: 16px!important;
    font-weight: normal;
    padding: 0px 5px 5px 0px;
    float: left;
}

ul.main_list2017 dt.pointDt {
    width: 100%;
    clear: left;
    display: none;
}

ul.main_list2017 dd {
    padding: 0px 5px 5px 0px;
    font-size: 16px!important;
}

ul.main_list2017 dd ul li {
    border: none!important;
    float: left;
    text-align: center;
    padding: 5px 0;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    color: #FFF;
    font-size: 14px!important;
    font-weight: normal!important;
    display: block;
    width: 142px;
    margin-right: 7px;
    margin-bottom: 7px;
}

ul.main_list2017 dd ul li.liOn {
    background: #009AAE;
}
ul.main_list2017 dd ul li.liOff {
    background: #E4F0F2!important;
}
ul.main_list2017 dd ul li:nth-child(3n+3) {
    margin-right: 0!important;
}

.top_br_none {
    border-top: none !important;
}
.bottom_br_none {
    border-bottom: none !important;
}
div.listlist {
    clear: left;
    width: 718px;
    padding: 0px 10px!important;
    margin-top: 10px;
}
div.listlist table {
    width: 100%;
}
/* 20241219 */
div.listlist table.listTable2017 thead {
    background: #E4F0F2;
}
div.listlist table.listTable2017 tr {
    vertical-align: middle;
}
div.listlist table.listTable2017 tbody tr {
    border-bottom: 1px #999 solid;
}
div.listlist table.listTable2017 tbody tr:last-child {
    border-bottom: none;
}
div.listlist table.listTable2017 tr th {
    text-align: center;
    font-weight: bold;
    padding: 5px 0;
    vertical-align: middle;
    display: table-cell;
}
div.listlist table.listTable2017 tr td {
    text-align: center;
    padding: 10px 0;
    vertical-align: middle;
}
div.listlist table.listTable2017 td input[type=checkbox] {
    width: 22px;
    height: 22px;
    transform: scale(0.85);
}
div.listlist table.listTable2017 tr td span.listKakaku {
    font-size: 18px!important;
    color: #e32d2e!important;
}
div.listlist table.listTable2017 tr td span.listHirosa {
    font-size: 12px!important;
}
.listDetailBtn a,
.listDetailBtn a::before,
.listDetailBtn a::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
div.listlist table.listTable2017 tr td.listDetailBtn a {
    padding: 5px 10px!important;
    /*background: #ff931e;
    background: #009AAE;*/
    background: #003366;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-size: 14px!important;
    font-weight: normal!important;
    color: #FFF;
    text-decoration: none;
}
div.listlist table.listTable2017 tr td.listDetailBtn a:hover {
    background: #ccc;
}

/* まとめてお問い合わせボタン */

.package_btn2024 {
    overflow: hidden;
    display: flex;
    justify-content: center;
}
.package_btn2024 p {
    color: #00399d;
    padding: 0px 15px 0px 35px;
}
.package_btn2024 p img {
    padding-bottom: 10px;
}
.package_btn2024 ul {
    padding: 5px 0 5px 0;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}

.package_btn2024 ul li.checkBtn1 {
    background: #00AD99;
    border-radius: 5px;
    width: 650px;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 10px; /* アイコンとテキストの間隔調整 */
}

.package_btn2024 ul li.checkBtn1 img {
    display: inline-block;
    max-width: 48px;
    height: auto;
    padding-left: 100px;
}

.package_btn2024 ul li.checkBtn1 a {
    padding: 15px 20px 15px 15px!important;
    text-decoration: none;
    font-weight: bold;
    font-size: 18px!important;
    color: #FFF;
    text-align: center;
}

.package_btn2024 ul li.checkBtn1:hover {
    opacity: 0.6;
    cursor: pointer;
}



/*	20170206 アコーディオン*/
.listlist .accordion {
    /*  border-top: 1px solid #999;
  width: 98%;*/
    
    margin-bottom: 2em;
}
.listlist .btn {
    text-align: center;
    display: block;
    text-decoration: none;
    padding: 10px!important;
    border: 1px solid #009AAE;
    /*background: #ff931e;*/
    -webkit-border-radius: 0px;
    border-radius: 0px;
    font-size: 18px!important;
    font-weight: normal!important;
    color: #009AAE;
    margin: 10px 0;
}

.listlist .btn:hover {
    color: #ffffff;
    background: #009AAE;
}
.listlist a.btn,
.listlist a.btn::before,
.listlist a.btn::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.listlist .triangle {
    position: relative;
}
.listlist .triangle:after {
    position: absolute;
    top: 50%;
    content: "";
    width: 8px;
    height: 8px;
    border-right: 2px solid #009AAE;
    border-top: 2px solid #009AAE;
    -webkit-transform: translate(32px, -5px) rotate(135deg);
    -ms-transform: translate(32px, -5px) rotate(135deg);
    transform: translate(32px, -5px) rotate(135deg);
    transition: border-color .3s ease, -webkit-transform .6s ease;
    transition: border-color .3s ease, transform .6s ease;
}
.listlist .triangle.is-active:after {
    -webkit-transform: translate(32px, -2px) rotate(-45deg);
    -ms-transform: translate(32px, -2px) rotate(-45deg);
    transform: translate(32px, -2px) rotate(-45deg);
}
.listlist .triangle:hover:after {
    border-color: #fff;
}
.listlist .accordion .contents {
    /*  border-top: 1px solid #999;*/
    
    padding: 0;
    padding-bottom: 10px;
}

/*	20170206 アコーディオンここまで */

/* 大学生オススメ物件 20171113*/
div.kodawariCollage {
    display: inline-block;
    clear: both;
    /*	margin-bottom: 10px!important;*/
}
div.kodawariCollage {
    margin-right: 20px;
    margin-top: 20px;
    width: 730px;
    float: left;
    background: #fff;
    border: 1px solid #cccccc;
    border-radius: 4px 4px 4px 4px;
    /* box-shadow */
    
    box-shadow: 0px 0px 10px 3px #ddd;
    -moz-box-shadow: 0px 0px 10px 3px #ddd;
    -webkit-box-shadow: 0px 0px 10px 3px #ddd;
}
h3.collageH3 {
    margin-bottom: 0px!important;
    width: 710px;
    background: #f38c1c;
    padding: 10px;
    text-decoration: none;
    color: #FFF;
    font-weight: bold;
    font-size: 18px;
    display: block;
    letter-spacing: 0.5px;
}
div.collageLeft {
    margin-right: 10px;
    float: left;
}
div.collageRight {
    line-height: 1.5;
    height: 92px;
    padding: 15px;
}
ul.kodawariCollageUl {
    margin-top: 10px;
}
ul.kodawariCollageUl li {
    background: #f38c1c;
    padding: 5px 0px;
    width: 130px;
    float: left;
    margin-right: 10px;
    border-radius: 20px;
    text-align: center;
}
ul.kodawariCollageUl li a {
    color: #FFF;
    font-weight: bold;
    text-decoration: none;
    display: block;
    letter-spacing: 0.5px;
}
ul.kodawariCollageUl li a:hover {
    opacity: 0.7;
}

/*	20180501 お問い合わせボタン */
.toiawaseBtnP {
    margin: 30px 0 0 120px;
}
.toiawasebutton {
    display: inline-block;
    width: 500px;
    height: 60px;
    text-align: center;
    text-decoration: none;
    line-height: 60px;
    outline: none;
}
.toiawasebutton::before,
.toiawasebutton::after {
    position: absolute;
    z-index: -1;
    display: block;
    content: '';
}
.toiawasebutton,
.toiawasebutton::before,
.toiawasebutton::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.toiawasebutton {
    background-color: #2d9d88;
    color: #f8d720;
    font-size: 23px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.toiawasebutton:hover {
    background-color: #d9e8ea;
    color: #2d9d88;
    border: 2px solid #2d9d88;
}
.toiawasebutton2 {
    display: inline-block;
    width: 500px;
    height: 60px;
    text-align: center;
    text-decoration: none;
    line-height: 60px;
    outline: none;
}
.toiawasebutton2::before,
.toiawasebutton2::after {
    position: absolute;
    z-index: -1;
    display: block;
    content: '';
}
.toiawasebutton2,
.toiawasebutton2::before,
.toiawasebutton2::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.toiawasebutton2 {
    background-color: #00339d;
    color: #fff;
    font-size: 23px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.toiawasebutton2:hover {
    background-color: #d9e8ea;
    color: #00339d;
    border: 2px solid #00339d;
}
#top_service_info .left p.rental {
    line-height: 1.4em!important;
}

/* 20180913 外国人向け入居のしおり */
div.foreignersTxtArea {
    margin-top: 20px;
    display: inline-block;
}
h5.foreignersTl {
    font-size: 18px;
}
p.foreignersTxt {
    float: left;
    width: 520px;
}
p.foreignersBtn {
    float: right;
}
.foreignersH3 {
    margin-top: 40px!important;
}

/* ポイント計算シュミレーション 20181128 */
p.pointInput {
    font-weight: bold;
    font-size: 14px;
}
p.pointInput input {
    text-align: right;
    font-weight: bold;
    font-size: 18px;
    padding-right: 10px;
}
p.pointInput input[type="button"] {
    background-image: linear-gradient(0deg, #a7d9f5, #eaf6fd);
    /* グラデーション */
    /*	border: 1px solid #3c7fb1; /* 枠線 */
    
    border-radius: 0.3em;
    /* 角丸 */
    
    font-size: 18px;
}
p#re_room_point {
    margin-top: 15px;
    font-weight: bold;
    display: block;
    /*	padding: 13px 0 7px 20px;
    background-color: #ffd2d2;*/
    
    color: #67ae74;
    width: 40%;
}
p#re_room_point span {
    font-size: 35px;
}

/* 申込配信方法 20201221 */
ul.mail {
    margin: 0 0 0 20px;
}
ul.mail li {
    padding: 0 0 0 20px;
    height: 24px;
    margin-bottom: 10px;
}
ul.mail li span {
    width: 10em;
    margin-right: 10px;
}
.previewbutton {
    background-color: #fff;
    border: #000;
    display: inline-block;
    width: 300px;
    height: 40px;
    text-align: center;
    text-decoration: none;
    line-height: 40px;
    outline: none;
    margin: 30px 150px;
}
.previewbutton::before,
.previewbutton::after {
    position: absolute;
    z-index: -1;
    display: block;
    content: '';
}
.previewbutton,
.previewbutton::before,
.previewbutton::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.previewbutton {
    background-color: #fff;
    border: 2px solid #33CCFF;
    color: #000;
    font-size: 18px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
}
.previewbutton:hover {
    background-color: #33CCFF;
    color: #00339d;
    border: 2px solid #33CCFF;
}

/* 退去申請 20210310 */
p.contact_top_text span {
    font-weight: bold;
    text-align: center;
    display: block;
    font-size: 20px;
    margin-top: 30px;
}
p.contact_top_text2 span {
    font-weight: bold;
    text-align: center;
    display: block;
    font-size: 20px;
    margin-top: 0px;
}
.contact_top_text {
    line-height: 1.5em!important;
    font-feature-settings: "palt";
}
.contact_top_text2 {
    font-feature-settings: "palt";
    line-height: 1.7em!important;
    background: #e8e8e8;
    padding: 10px 10px 20px 10px;
    width: 660px;
    font-size: 13px;
}

.cautions2 {
    font-weight: bold;
    font-size: 16px;
    margin-top: 30px;
}
.cautions3 {
    font-weight: bold;
    font-size: 18px;
    margin-top: 5px;
}

/* 20230512 */
.left_and_right .full_box {
    width: 100%;
    padding: 0 10px;
    line-height: 25px;
}

.insurance_price_list {
    border: 1px solid #999;
    text-align: center;
    width: 730px;
    margin-bottom: 10px;
}

p.kome1 {
    font-weight: normal;
    font-size: 13px;
}

p.kome2 {
    text-align: right;
    font-weight: normal;
    font-size: 13px;
}
/* 20230328 ここまで */

/* 20240913 */
.left_and_right .full_box2024 {
    width: 100%;
    padding: 0 ;
    line-height: 25px;
}

.insurance_expense dd.height130 {
    height: 130px;
}

.insurance_expense dd.height200 {
    height: 200px;
}

p.tabbutton{
    display: flex;
}

/* ボタン */

.button-a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #2589d0;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    text-decoration: none;
}

.button-a:hover {
    background-color: #1579c0;
}

.button-b {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #F58220;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
}

.button-c {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #F58220;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    text-decoration: none;
}

.button-c:hover {
    background-color: #F5B720;
}

.button-d {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #2589d0;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
}


/* 友の会 入居者補償制度の概要 */
.insurance_outline2024 {
    border: solid 1px #999;
    width: 720px;
    margin-left: 10px;
}

.insurance_outline2024 tr td span {
    font-weight: bold;
    color: #A1806C;
}

.insurance_outline2024 th {
    border: solid 1px #999;
    background-color: #A1806C;
    color: #fff;
    vertical-align: middle;
}

.insurance_outline2024_01 {
    background-color: #ffffff;
}

.insurance_outline2024_title {
    background-color: #F58220;
    vertical-align: middle;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
    color: #fff;
}

.insurance_outline2024_02 {
    background-color: #ffffff;
}

.insurance_outline2024 .insurance_outline_02_title {
    background-color: #F5B720;
    vertical-align: middle;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
    color: #fff;
}
.insurance_outline2024 td,
.insurance_outline2024-b td {
    border: solid 1px #999;
    vertical-align: middle;
    padding: 5px;
}


tr td.ltbrown {
    background-color: #F5EEE6; /* 背景色の例 */
}
tr.insurance_outline2024_01 td:nth-child(4) {
    background-color: #f0f0f0; /* 背景色の例 */
    vertical-align: top;

}

.insurance_outline2024-b {
    border: solid 1px #999;
    width: 720px;
    margin-left: 10px;
}

.insurance_outline2024-b th {
    border: solid 1px #999;
    background-color: #F69C9F;
    color: #fff;
    vertical-align: middle;
}

tr.insurance_outline2024_03 td:nth-child(1) {
    background-color: #F6DADA; /* 背景色の例 */
}

/*-------------- ベーススタイル 2024 --------------*/
body.new_2024 {
    font-family: 'Noto Sans JP', sans-serif;
    margin: 0;
    padding: 0;
    line-height: 1.6;
    color: #333;
}

/* ヘッダー全体の設定 */
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    width: 100%;
    background-color: #fff;
    padding: 10px 20px;
    box-sizing: border-box;
    z-index: 999;
    box-shadow: 0px 3px 6px 3px rgba(0,0,0,0.16);
}

/* ヘッダー内のコンテナ設定 */
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
}

/* 左側のロゴとバナーのスタイル */
.header-left {
    display: flex;
    align-items: center;
}

.header-left h1,
.header-left img {
    margin-right: 20px;
}

.header-left img:nth-child(1) {
    width: 140px;
    margin-top: 4px;
}

.header-left img:nth-child(2) {
    width: 210px;
}

/* 右側 */
.header-right {
    display: flex;
    align-items: center;
    position: relative;
}

.header-container h2 {
    margin-top: 15px;
}

.header-container h2 img {
    width: 120px;
}

/* グローバルメニューのスタイル */
.global_menu {
    flex-grow: 1;
    display: flex;
    justify-content: center; /* 中央揃え */
    align-items: center;
}

.global_menu {
    position: relative; /* 親要素に相対位置を設定 */
    margin-top: 15px;
}

.global_menu ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    justify-content: end;
    margin-right: 2vw;
}

.global_menu ul li {
    position: relative;
    margin: 0 15px;
}

/* リンクの下にアニメーション付きの下線を追加 */
.global_menu ul li a {
    text-decoration: none;
    color: #333;
    padding: 0 20px;
    position: relative;
    display: inline-block;
    padding-bottom: 20px;
}

/* リンクの下にアニメーション付きの下線を追加 */
.global_menu ul li a::after {
    content: "";
    position: absolute;
    left: 50%; /* 中央に配置 */
    bottom: -5px;
    height: 4px; /* 下線の太さ */
    width: 40px; /* 下線の幅 */
    background-color: #009AAE; /* 紺色の下線 */
    opacity: 0; /* 初期状態で透明 */
    transform: translateX(-50%); /* 中央に揃えるための調整 */
    transition: opacity 0.3s ease; /* アニメーション */
    z-index: 2; /* 例: より高い値に設定 */
}

/* 縦線の設定 */
.global_menu ul li {
    position: relative;
    margin: 0 15px;
}

.global_menu ul li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 1px;
  right: -16px;
  height: calc(100% - 20px);
  width: 1px;
  background-image: url('/img/renewal2024/vertical-line.svg'); /* SVG画像へのパス */
  background-repeat: no-repeat;
  background-size: contain; /* 画像のサイズを調整 */
  z-index: 1;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* リンクにホバーしたとき */
.global_menu ul li a:hover::after {
    opacity: 1; /* ホバー時に下線が表示される */
}
/* ホバー時のアニメーション */
.global_menu ul li a.active::after {
    width: 40px;
    opacity: 1;
}

/* 子メニューの初期状態 */
.global_menu ul li ul.child_menu {
    visibility: hidden;
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
    position: fixed;
    top: 80px;
    left: 0px;
    padding-left: 0;
    bottom: -55px;
    height: 55px;
    width: 100vw;
    background-color: #003366;
    z-index: 1;
    display: flex;           /* フレックスボックスに変更 */
    justify-content: center;  /* 子メニュー内のli要素を左右中央に配置 */
    align-items: center;      /* 子メニュー内のli要素を上下中央に配置 */
}

.global_menu ul li ul.child_menuA {
    padding-left: 5vw;
}
.global_menu ul li ul.child_menuB {
    padding-left: 10vw;
}
.global_menu ul li ul.child_menuC {
    padding-left: 20vw;
}
.global_menu ul li ul.child_menuD {
    padding-left: 25vw;
}


/* ホバー時の子メニューの表示 */
.global_menu ul li:hover ul.child_menu {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

.global_menu ul li ul {
    padding-left: 0vw;
}
/* 子メニューのリストアイテム */
.global_menu ul li ul.child_menu li {
    list-style: none;
    text-align: center;
    z-index: 100;
    margin: 0 15px 0 0px;   /* li要素の左右の余白を設定 */
    cursor: pointer;
    display: inline-block; /* inline-blockでli要素を横並びに */}

/* 子メニュー内のリンク */
.global_menu ul li ul.child_menu li a {
    color: #fff; /* 文字色を白に */
    text-decoration: none;
    padding: 10px 20px;
    display: inline-block;
    position: relative;
    cursor: pointer;
    transition: color 0.3s ease;
}
/* 子メニュー内のリンク */
.global_menu ul li ul.child_menu li a:hover {
    color: #aaa; /* 文字色を白に */
}

/* 子メニュー内のリンクの下線アニメーションを削除 */
.global_menu ul li ul.child_menu li a::after {
    content: none; /* 下線のアニメーションを削除 */
}

/* 子メニューの各 li の右側に縦線を追加 */
.global_menu ul li ul.child_menu li {
    position: relative; /* 縦線を表示するために相対位置を設定 */
    padding-right: 10px; /* 縦線とリンクの間にスペースを追加 */
}

/* 縦線の設定 */
.global_menu ul li ul.child_menu li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  height: calc(100% - 20px);
  width: 1px;
  background-image: url('/img/renewal2024/vertical-line2.svg'); /* SVG画像へのパス */
  background-repeat: no-repeat;
  background-size: contain; /* 画像のサイズを調整 */
  z-index: 1;
}

/* アニメーション */
.global_menu ul li ul {
    animation: slideDown 0.5s ease-in-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* モバイル表示のバナー */
.sp-banner {
    display: none;
}



/* PC版でのスタイル */
@media (min-width: 769px) {
    .global_menu {
        display: block;
    }

    .mobile-nav,
    .hamburger {
        display: none;
    }
}

/* PC非表示 */
.pc-show {
    display: block;
}

.sp-show {
    display: none!important;
}

/* スマホ版でのスタイル */
@media (max-width: 900px) {

    /* PC非表示 */
    .pc-show {
        display: none!important;
    }

    .sp-show {
        display: block!important
    }

    .sp-hide{
        display: none;
    }
    header {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 67px;
        border-bottom: none;
        padding: 0px 0px 10px;
        z-index: 1000; /* スクロールの際にナビゲーションが常に最前面に表示されるようにする */
    }

    .header-container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0px 20px;
        box-shadow: none;
        height: 70px;

    }

    .header-container h2 {
        margin-left: auto; /* これでh2が右寄せされます */
        margin-top: 21px;
        margin-right: 5px;
    }

    .header-container h2 img {
        width: 95px;
    }

    .header-left img:nth-child(1) {
        width: 129px;
        margin-top: 13px;
    }

    .header-left img:nth-child(2) {
        display: none; /* ヘッダーの下に配置 */
    }

    /* ロゴA、ロゴB、ハンバーガーを横一列に揃える */
    .header-right {
        display: flex;
        align-items: center;
    }

    .header-right img {
        width: 77px;
    }

    /* 元の位置ではバナーを非表示に */
    .header-left {
        display: flex;
        align-items: center;
    }

    .global_menu {
        display: none;
    }

    /* スマホ版のハンバーガーメニュー */
    .hamburger {
        display: block;
        cursor: pointer;
        width: 30px;
/*        height: 22px;*/
        position: relative;
    }

    .hamburger span {
        display: block;
        width: 25px;
        height: 2px;
        margin: 5px;
        background-color: #333;
        transition: all 0.3s ease;
    }

    .hamburger.active span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }

    .hamburger.active span:nth-child(2) {
        opacity: 0;
    }

    .hamburger.active span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -5px);
    }

/* モバイルナビゲーション */
.mobile-nav {
    display: none;
    position: absolute;
    top: 70px;
    left: 0;
    width: calc(100% - 80px);
    background-color: #fff;
    padding: 20px;
    padding-left: 80px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    opacity: 0;
    transform: translateY(-20px);
    transition: all 0.3s ease;
    z-index: 1000; /* mobile-navを最前面に表示 */
}

.mobile-nav.active {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

/* 左端に縦のブルーラインを追加 */
.mobile-nav::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 30px; /* ラインの太さ */
    height: 100%;
    background-color: #144293; /* ブルーのカラー */
}

.mobile-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

/* メニューアイテムをブロックレベル要素として表示し、タイトルと + ボタンを横並びにする */
li.menu {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between; /* タイトルとボタンの間にスペースを追加 */
    padding-top: 5px;
    padding-bottom: 5px;
    flex-wrap: wrap; /* 子メニューが表示された際に折り返すようにする */
    border-top: 1px solid #333;
    margin-right: 50px;
}

.menu a {
    display: block; /* ブロック要素として扱う */
    text-decoration: none;
    padding: 10px 0;
    font-size: 18px;
    color: #333;
    position: relative;
    z-index: 1;
    flex-grow: 1; /* タイトル部分が可能な限り広がる */
}

/* アコーディオンメニューが開いている時の文字色 */
.menu.active a {
    color: #039C7F; /* 例えばオレンジ色に変更 */
}

/* メニューの右端に + ボタンを配置 */
.menu-toggle {
    font-size: 25px;
    cursor: pointer;
    padding: 0 10px;
    margin-left: auto;
    z-index: 2;
}

.menu-toggle::after {
    content: '\002B'; /* +マーク */
}




.menu-toggle.active::after {
    content: '\2212'; /* -マーク */
    color: #039C7F; /* アイコンの色 */
}

/* child_menu のスタイル */
.child_menu {
    max-height: 0;
    overflow: hidden;
    background-color: #fff;
    padding: 0 10px 0 50px!important;
    list-style: none;
    transition: max-height 0.3s ease;
    width: 100%; /* 子メニューを親メニューと同じ幅に */
}
.child_menu a {
    font-size: 16px;
}

/* child_menu がアクティブなときに表示 */
.child_menu.active {
    max-height: 300px;
}
.child_menu.active a {
    color: #333333; 
}

/* アクティブなメニューに適用 */
.menu.active {
}

/* .child_menu のリストアイテムをフレックスボックスに設定 */
.child_menu li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%; /* li が親要素の幅を占めるように設定 */
}

/* リンクの右端に > アイコンを追加 */
.child_menu li a {
    display: flex;
    align-items: center;
}

/* リンクの右端に > アイコンを追加 */
/*.child_menu li a::after {*/
/*    content: '>'; /* > アイコン */
/*    font-size: 18px; /* アイコンのサイズ */
/*    margin-left: 8px; /* アイコンとテキストの間隔 */
/*    color: #333; /* アイコンの色 */
/*    display: inline-block;*/
/*}*/

.sp-banner {
    display: block;
    position: fixed;
    top: 70px;
    left: 0;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.6);
    z-index: 20;
    text-align: center;
}

.sp-banner img {
    padding: 7px 0 7px;
    width: 185px;
}

/* アニメーション */
.mobile-nav.active {
    animation: fadeIn 0.5s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

}



/* 個別のボタンスタイル */
#button1 {
    background-color: #43B0C5; /* デフォルトの背景色 */
}

#button2 {
    background-color: #00AD99; /* デフォルトの背景色 */
}

#button3 {
    background-color: #579BDE; /* デフォルトの背景色 */
}

/* 固定3ボタン */
.fixed-buttonsA {
    position: fixed;
    bottom: 352px;
    right: 0; /* 右端に固定 */
    display: flex;
    flex-direction: column;
    z-index: 1000; /* 他の要素の上に表示する */
}

.fixed-buttonsB {
    position: fixed;
    bottom: 258px;
    right: 0; /* 右端に固定 */
    display: flex;
    flex-direction: column;
    z-index: 1000; /* 他の要素の上に表示する */
}

.fixed-buttonsC {
    position: fixed;
    bottom: 164px;
    right: 0; /* 右端に固定 */
    display: flex;
    flex-direction: column;
    z-index: 1000; /* 他の要素の上に表示する */
}

/* ボタンのデフォルトスタイル */
.contact-button {
    display: flex;
    align-items: center;
    position: relative; /* 相対位置に設定 */
    width: 50px; /* デフォルトの幅 */
    height: 60px; /* 高さ */
    background-color: #43B0C5; /* デフォルトの背景色 */
    color: white;
    text-align: center;
    overflow: hidden; /* 内容がはみ出すのを防ぐ */
    text-decoration: none; /* リンクの下線を削除 */
    transition: width 0.5s ease, transform 0.5s ease; /* 幅と位置の変更にアニメーション */
    padding: 10px; /* アイコンとテキストの余白 */
}

/* 各ボタンのホバー時のスタイル */
.contact-button:hover {
    width: 180px; /* ホバー時の幅 */
    z-index: 2000; /* ホバー時のボタンを前面に表示 */
}

/* アイコンのスタイル */
.contact-button svg {
    width: 50px;
    height: 50px;
    margin-right: 0px; /* アイコンとテキストの間隔 */
    text-align: center;
}

/* テキストのスタイル */
.contact-button .button-text {
    position: absolute;
    right: 20px; /* 右からの位置調整 */
    opacity: 0; /* 初期状態で非表示 */
    transition: opacity 0.5s ease; /* テキストの表示/非表示にアニメーション */
    white-space: nowrap; /* テキストを1行に */
    font-size: 16px;
}

/* ボタンのホバー時のテキストのスタイル */
.contact-button:hover .button-text {
    opacity: 1; /* テキストを表示 */
}


/* トップに戻るボタン */
.tothetop {
    position: fixed;
    bottom: 10px;
    right: 10px;
    display: flex;
    flex-direction: column;
    z-index: 1000; /* 他の要素の上に表示する */
    opacity: 0; /* 初期状態は非表示 */
    pointer-events: none; /* クリックを無効化 */
    transition: opacity 0.3s ease; /* フェードイン/アウトのアニメーション */
}

.tothetop.show {
    opacity: 1; /* 表示 */
    pointer-events: auto; /* クリックを有効化 */
}

.tothetop a {
    opacity: 0.8;
}

.tothetop a:hover {
    opacity: 0.6;
}



/* 768px以下のスタイル */
@media (max-width: 900px) {
    .fixed-buttonsA,
    .fixed-buttonsB,
    .fixed-buttonsC {
        display: none;
    }

    .tothetop {
        bottom: 10px;
        right: 15px; 
    }

    .tothetop_detail {
        bottom: 80px;
        right: 15px; 
    }

    .tothetop a img {
        width: 56px;
    }

}




/* hero */
.hero {
    position: relative;
    width: 100%;
    height: 90vh;
    overflow: hidden;
    margin-top: 80px;
}

#hero-video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: auto;
    min-width: 100vw;
    min-height: 100vh;
    object-fit: cover;
    transform: translate(-50%, -50%) scale(1.1);
    z-index: -1;
    background-color: #ffffff;
}

/* ロゴを中央に配置するスタイル */
.logo-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    opacity: 0;
    animation: fadeIn 2s ease-in-out;
    animation-delay: 2s;
    animation-fill-mode: forwards;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.hero-logo {
    max-width: 240px;
    height: auto;
}

/* .search-containerのスタイル */
.search-container {
    max-width: 1080px;
    width: 100%;
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: flex-start;
    box-sizing: border-box;
}

/* 背景色を調整するための .search-inner */
.search-inner {
    background-color: rgba(255, 255, 255, 0.7);
    padding: 10px 20px 20px;
    flex-direction: column;
    box-sizing: border-box;
    width: 510px; /* 固定幅で左に揃える */
    max-width: 510px; /* 必要に応じて幅を制限 */
    border-radius: 5px;
}

/* アイコンとテキストを中央揃えにする */
.search-title {
    display: flex; /* 要素を横並びに */
    align-items: end; /* 上下中央揃え */
}

/* アイコンとテキストの間隔 */
.search-title svg {
    margin-right: 8px;
    flex-shrink: 0; /* アイコンのサイズ変更を防ぐ */
    padding-top: 3px;
}

.rotated-icon {
    padding-left: 5px;
    transform: rotate(-45deg);
}

.search-title span {
    padding-left: 0px;
    font-size: 24px;
    color: #666;
}


/* テキストボックスのスタイル */
#freeWordPC {
    width: 400px; /* 必要に応じて調整 */
    padding: 10px 20px;
    font-size: 16px;
    border: 2px solid #ccc;
    border-radius: 5px;
    margin-right: 10px;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
}

/* 検索ボタンのスタイル */
#btnSearchPC {
    background-color: #43B0C5;
    color: white;
    width: 45px; /* ボタンの幅を正円にする */
    height: 45px; /* ボタンの高さを正円にする */
    border: none;
    border-radius: 50%; /* 正円にする */
    font-size: 20px; /* アイコンのサイズを調整 */
    font-weight: bold;
    cursor: pointer;
    display: inline-block;
    justify-content: center;
    align-items: center;
    transition: background-color 0.3s ease;
    /*box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* ボタンに少し影を付ける */
}

/* 検索ボタンのホバー時のスタイル */
#btnSearchPC:hover {
    background-color: #fff;
    color: #43B0C5;
}

/* コンテンツエリア */
.content-area {
    max-width: 1080px;
    margin: 0 auto;
    padding: 20px;
    position: relative;
    z-index: 1; /* 検索インターフェイスの下に配置 */
}



/* section.top-search (PC表示時) */
.top-search .button-group {
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 1080px; /* 3つのボタンの幅が合計1290px */
    margin: 0 auto; /* 中央揃え */
    padding-top: 30px;
}


/* ボタンのベーススタイル */
.blue-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 280px; /* 幅 */
    height: 50px; /* 高さ */
    background-color: #43B0C5;
    color: white;
    padding: 15px 30px;
    border: none;
    cursor: pointer;
    position: relative;
    border-radius: 10px;
    transition: background-color 0.3s ease;
    text-decoration: none;
  }
  
  /* アイコンの左側スタイル */
  .icon-left {
    width: 34.718px;
    height: 45.391px;
    transition: all 0.5s ease;
  }
  
  /* 各SVGパーツのアニメーション */
  .icon-left rect, .icon-left path {
    transition: all 0.5s ease;
  }
  
  /* アイコンの右側スタイル */
  .icon-right {
    fill: #fff;
    transition: fill 0.3s ease;
  }
  
  /* ボタンテキストのスタイル */
  .button-text {
    flex: 1;
    text-align: center;
    margin: 0 10px;
    transition: color 0.3s ease;
    font-size: 22px;
  }
  
  /* --- PC版のホバーアニメーション --- */
  @media (min-width: 769px) {
    /* ホバー時のボタンスタイル */
    .blue-button:hover {
      background-color: #E6E6E6;
    }
  
    /* ホバー時のアイコン左側のスタイル */
    .blue-button:hover .icon-left {
      width: 34.718px;
      height: 50.391px;
    }
  
    /* ホバー時のSVGパーツのアニメーション */
    .blue-button:hover .icon-left #kyushu {
      transform: translate(0, 28.213px); /* 九州の移動 */
      fill: #959595; /* 色の変化 */
    }
  
    .blue-button:hover .icon-left #shikoku {
      transform: translate(11.404px, 42.01px); /* 四国の移動 */
      fill: #959595; /* 色の変化 */
    }
  
    .blue-button:hover .icon-left #honshu {
      transform: translate(5.142px, 6.184px); /* 本州の移動 */
      fill: #959595; /* 色の変化 */
    }
  
    .blue-button:hover .icon-left #hokkaido {
      transform: translate(23.061px, -5px); /* 北海道の移動 */
      fill: #959595; /* 色の変化 */
    }
  
    /* ホバー時のアイコン右側のスタイル */
    .blue-button:hover .icon-right tspan {
      fill: #959595;
    }
  
    /* ホバー時のボタンテキストのスタイル */
    .blue-button:hover .button-text {
      color: darkgray;
    }
  
    /* ボタンBのホバーアニメーション */
    #buttonB:hover .icon-left {
      transform: scaleY(1.25); /* 縦方向に1.3倍に拡大 */
    }
  
    #buttonB:hover .icon-left #decoration {
      fill: #959595 !important;
    }
  
    #buttonB:hover .icon-left #base,
    #buttonB:hover .icon-left #left-part,
    #buttonB:hover .icon-left #right-part,
    #buttonB:hover .icon-left #center-part {
      fill: #E6E6E6 !important;
    }
  
    /* ボタンCのホバーアニメーション */
    #buttonC #group-352 {
    transition: width 0.5s ease, height 0.5s ease;
    }

    #buttonC #path-849,
    #buttonC #path-850 {
    transition: fill 0.5s ease, transform 0.5s ease;
    }

    #buttonC:hover #group-352 {
    width: 38.629px;
    height: 50px;
    }

    #buttonC:hover #path-849 {
    fill: #959595;
    transform: translate(-1px, 15px);
    }

    #buttonC:hover #path-850 {
    fill: #959595;
    transform: translate(6px, -6px);
    }
   
    #buttonC.no-hover:hover,
    #buttonC:active,
    #buttonC:focus {
        background-color: #00AD99 !important;
        transform: none !important;
    }
    
    #buttonC:hover #group-352,
    #buttonC.no-hover:hover #group-352,
    #buttonC:active #group-352,
    #buttonC:focus #group-352 {
        transform: none !important;
        fill: #fff !important; /* タップ後も白を維持 */
    }
}
      

      
/* メッセージコンテナの相対位置を基準にする */
.message-container {
    position: relative;
    padding: 70px 0 30px;
    text-align: center;
    opacity: 0;
    transition: opacity 3s ease-out, transform 3s ease-out;
}

/* フェードインする際のスタイル */
.message-container.show {
    opacity: 1;
    transform: translateY(0);
}

/* h2, h3 のスタイル */
.message-container h2 {
    font-size: 28px;
    font-weight: 200 !important;
}

.message-container h3 {
    font-size: 24px;
    font-weight: 200 !important;
    width: 100%;
}

/* 左下に配置するimgタグ */
.img-bottom-left {
    position: absolute;
    bottom: -50px; /* 下からの距離 */
    left: 10px; /* 左からの距離 */
    width: 200px; /* 必要に応じて調整 */
    height: auto;
}

/* 右下に配置するimgタグ */
.img-bottom-right {
    position: absolute;
    bottom: -50px; /* 下からの距離 */
    right: 10px; /* 右からの距離 */
    width: 210px; /* 必要に応じて調整 */
    height: auto;
}


/* スマートフォン用検索コンテナ */
.top-search .search-containerSP {
  display: none;
}

/* タイトルとSVGアイコンを配置 */
.search-containerSP .search-title {
    display: flex;
    align-items: center;
    margin-bottom: 10px; /* タイトルの下に余白を追加 */
}

.search-containerSP .search-title svg.icon-left {
    margin-right: 10px; /* アイコンとテキストの間隔 */
}



/* 検索インターフェイスの調整 */
.search-containerSP {
    padding: 20px;
    background-color: #f0f0f0;
    display: block;
}
.search-inner form {
  display: block;
    width: 90vw;
}

.search-containerSP .search-inner input[type="text"] {
    padding: 15px;
    font-size: 18px;
    border: 2px solid #ccc;
    border-radius: 5px;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
}

/* テキストボックスのホバー・フォーカス時のスタイル */
.search-containerSP .search-inner input[type="text"]:focus {
    border-color: #43B0C5;
    outline: none;
}

/* 900px以下の表示 */
@media (max-width: 900px) {

    .top-search .search-containerSP {
        width: 100vw; /* ビューポート幅いっぱいに広げる */
        margin-left: calc(-50vw + 50%); /* 左右のマージンを調整して全幅に */
        padding: 10px 20px;
        background-color: #f0f0f0;
        box-sizing: border-box;
        clip-path: none; /* 斜めカットを解除 */
        display: inline-block;
        height: 20vh;
    }


    .top-search .message-container {
        width: 100%;
        margin-top: 20px;
        background-color: #fff;
        padding: 20px 0;
        text-align: center;
    }

    .top-search .message-container h2 {
        margin: 0 0 10px;
        font-size: 4.5vw;
        font-feature-settings: "palt";
}

    .top-search .message-container h3 {
        margin: 0 0 10px;
        font-size: 3vw;
        letter-spacing: 0;
        font-feature-settings: "palt";
    }

    /* タイトルコンテナ */
    .title-container {
        display: flex;
        align-items: center;
        margin-bottom: 10px; /* タイトルと検索ボックスの間にスペース */
        text-align: left; /* 左揃え */
    }

    /* アイコンスタイル */
    .icon-search {
        width: 24px;
        height: 24px;
        margin-right: 8px; /* タイトルとの間隔 */
    }

    /* タイトルスタイル */
    .search-title {
        font-size: 18px;
        color: #333;
    }

    .search-title span {
        padding-left: 10px;
        font-size: 16px;
    }

    .search-innerSP {
        margin: 0 auto!important;
    }

    .rotated-icon {
        transform: rotate(-45deg);
    }

    /* 左下に配置するimgタグ */
    .img-bottom-left {
        display: none;
    }

    /* 右下に配置するimgタグ */
    .img-bottom-right {
        position: absolute;
        bottom: -60px; /* 下からの距離 */
        right: 0px; /* 右からの距離 */
        width: 210px; /* 必要に応じて調整 */
        height: auto;
    }


}

/* カルーセル */
.carousel-section {
  padding: 40px 0;
  justify-content: center;
  position: relative;
  margin-bottom: 50px;
  background: linear-gradient(to bottom, #F8F8F8 75%, #FFFFFF 25%);
}

.carousel-container {
  width: 1080px;
  max-width: 1080px;
  position: relative;
  margin: 50px auto 0;
}


/* 左右のボタン共通スタイル */
.carousel-control {
  position: absolute;
  top: 30%;
  transform: translateY(-50%);
  width: 36px; /* 半円の幅 */
  height: 72px; /* 円の直径 */
  background: #43B0C5;
  border: none;
  cursor: pointer;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}

/* 左ボタン（左半分が欠けた円） */
.carousel-control.prev {
  left: 0;
  border-top-right-radius: 36px; /* 右上の角を丸くする */
  border-bottom-right-radius: 36px; /* 右下の角を丸くする */
}

.carousel-control.prev::before {
  content: '';
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 14px solid #fff; /* 左向きの三角形 */
  position: relative; /* 三角形の位置を調整可能に */
  left: -5px; /* 左に5px移動 */
}

/* 右ボタン（右半分が欠けた円） */
.carousel-control.next {
  right: 0;
  border-top-left-radius: 36px; /* 左上の角を丸くする */
  border-bottom-left-radius: 36px; /* 左下の角を丸くする */
}

.carousel-control.next::before {
  content: '';
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 14px solid #fff; /* 右向きの三角形 */
  position: relative; /* 三角形の位置を調整可能に */
  right: -5px; /* 右に5px移動 */
}


.slick-dotted.slick-slider {
    margin-bottom: 0px;
}

.slick-slide {
    margin-right: 20px;
    width: 350px;
}

.carousel-card img {
  width: 100%;
  height: auto;
}

.carousel-inner {
  padding: 10px 30px 10px 10px;
  height: 170px;
  background-color: #E6E6E6;
}

.carousel-card h3 {
  font-size: 22px;
  margin-top: 15px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  position: relative;
  padding-left: 25px;
  font-weight: normal;
  line-height: 1.2;
  width: 100%;
}

.carousel-card h3::before {
  content: '';
  position: absolute;
  left: 0;
  top: 52%;
  transform: translateY(-50%);
  height: 50px;
  width: 12px;
  background-color: #43B0C5;
}

.carousel-card h3 span {
  font-size: 16px;
}

.carousel-card p {
  font-size: 17px;
  margin: 20px 0;
  padding-left: 25px;
  text-align: justify;
}

.reroom-h3 p {
  margin: 5px 0 15px;
}

.carousel-card a {
  text-decoration: none;
  color: #007BFF;
  font-weight: bold;
}

.carousel-card a.read-more {
  display: block;
  text-align: right;
  color: #5A5A5A;
  margin-top: 15px;
  font-weight: normal;
}

.carousel-card a.read-more:hover {
  text-decoration: none;
  color: #00AD99;
}

.carousel-card a.read-more span.arrow {
  margin-left: 5px;
  transition: transform 0.3s ease;
  display: inline-block;
}

.carousel-card a.read-more:hover span.arrow {
  transform: translateX(5px);
}

/* デフォルトの小さいドットを非表示にする */
.slick-dots li button:before {
    content: none !important;
}


/* ドットの共通設定 */
.slick-dots {
  position: absolute !important; /* 絶対配置 */
  bottom: -50px !important; /* carousel-container より50px下に配置 */
  left: 50% !important; /* 水平方向で中央に配置 */
  transform: translateX(-50%) !important; /* 中央揃え */
  text-align: center !important; /* ドットを中央に寄せる */
  width: 100% !important; /* 全体幅を100%に */
  z-index: 1 !important; /* ドットが他の要素より前に表示されるように */
}

/* すべてのドットのサイズを12pxに統一 */
.slick-dots li button {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background-color: gray !important; /* 非アクティブのドットは灰色 */
  border: none !important;
  margin: 0 5px !important; /* ドット間のスペースを調整 */
}

/* アクティブなドットの色変更 */
.slick-dots li.slick-active button {
  background-color: #43B0C5 !important; /* アクティブなドットの色 */
}

/* カルーセル 下層ページ20241216 */
.low-carousel .carousel-section {
    padding: 0px 0 40px;
    background:none;
}

.low-carousel .carousel-card {
    display: flex!important;
}

.low-carousel .carousel-card img {
    width: 170px; /* 画像は40% */
    max-width: 170px; /* 親要素を超えないように設定 */
    height: 170px; /* 縦横比を保持 */
    object-fit: cover; /* 縦横比を保持してサイズ調整 */
    flex-shrink: 0; /* 縮小を防ぐ */
}

.low-carousel .carousel-inner {
    width: 50%; /* テキスト部分は60% */
    padding: 10px 15px 0 15px; /* 内側の余白を設定 */
    text-align: left; /* 左揃え */
    box-sizing: border-box; /* パディングを含めて計算 */
    flex-grow: 1; /* テキスト領域を伸ばす */
    min-height: 150px; /* 各カードの最小高さを設定 */
}

.low-carousel .carousel-card h3 {
    font-size: 17px; /* ビューポート幅に応じたフォントサイズ */
    margin-bottom: 0px; /* 下マージン */
    margin-top: 0; /* 上マージン */
    padding-left: 12px; /* 左パディング */
    height: 60px; /* 高さ */
}

.low-carousel .carousel-card h3.carousel_reroom {
    margin: 10px 0 12px;
    padding: 0 0 0 12px;
    height: auto; /* 高さを自動調整 */
    display: flex;
    flex-direction: column; /* 縦並びに変更 */
    align-items: flex-start; /* 左揃え */
}

.low-carousel .carousel-card h3.carousel_reroom span.small-text {
    display: block;
    font-size: 13px; /* フォントサイズ調整 */
    margin-top: 2px; /* 適度な余白を追加 */
}

.low-carousel .carousel-card h3::before {
    content: '';
    position: absolute; /* 擬似要素の位置 */
    left: 0; /* 左側 */
    top: 50%; /* 中央に配置 */
    transform: translateY(-50%); /* 中央に配置 */
    height: 35px; /* 高さ */
    width: 6px; /* 幅 */
    background-color: #43B0C5; /* 色 */
}

.low-carousel .carousel-card p {
    font-size: 13px; /* ビューポート幅に応じたフォントサイズ */
    margin: 0px 0 0; /* マージン */
    padding-left: 0px; /* 左パディングなし */
    text-align: justify; /* 両端揃え */
    line-height: 1.3;
}

.low-carousel .carousel-card a.read-more {
    position: absolute;
    bottom: 15px;
    width: 200px; /* 幅を80%に設定 */
    max-width: 200px; /* 最大幅を280pxに設定（必要に応じて調整可能） */
    text-align: center;
    background-color: transparent;
    color: #707070;
    border: none;
    border-radius: 6px;
    font-weight: normal;
    text-decoration: none;
    box-sizing: border-box;
    transition: background-color 0.3s, color 0.3s;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
}

.low-carousel .carousel-card a.read-more .arrow {
    margin-left: 10px;
    font-size: 14px;
}

.low-carousel .carousel-card a.read-more:hover {
    color: #707070;
}

.low-carousel .carousel-control {
    display: none!important;
}


@media screen and (max-width: 900px) {
   .carousel-section {
        overflow: visible;
        padding: 40px 20px 0px 20px; /* 下に余白を追加してドットのためのスペースを確保 */
        box-sizing: border-box;
        width: 100%;
        background: linear-gradient(to bottom, #F8F8F8 70%, #FFFFFF 30%);
    }

    .carousel-container {
        width: 100%;
        padding: 10px 0 0 ;
        margin: 0;
        box-sizing: border-box;
        overflow: visible; /* ドットが隠れないように overflow を visible に変更 */
        padding-bottom: 0px; /* ドットが隠れないように余白を確保 */
    }

    .carousel-card {
        display: flex!important;
        flex-direction: row; /* 横並び */
        justify-content: space-between; /* 要素間のスペースを均等に */
        align-items: flex-start; /* 画像を上寄せに配置 */
        width: 100%; /* カードの全体幅を100%に設定 */
        padding: 0 0 0px; /* カード内の余白を確保 */
        min-height: 170px; /* 各カードの最小高さを設定 */
        margin-right: 0;
        background: #e6e6e6;
    }

    .carousel-card img {
        width: 50%; /* 画像は40% */
        max-width: 50%; /* 親要素を超えないように設定 */
        height: auto; /* 縦横比を保持 */
        object-fit: contain; /* 縦横比を保持してサイズ調整 */
        flex-shrink: 0; /* 縮小を防ぐ */
    }


    .carousel-inner {
        width: 50%; /* テキスト部分は60% */
        padding: 10px 15px 0 15px; /* 内側の余白を設定 */
        text-align: left; /* 左揃え */
        box-sizing: border-box; /* パディングを含めて計算 */
        flex-grow: 1; /* テキスト領域を伸ばす */
        min-height: 150px; /* 各カードの最小高さを設定 */
    }

    
    .carousel-card h3 {
        font-size: 3.8vw; /* ビューポート幅に応じたフォントサイズ */
        margin-bottom: 10px; /* 下マージン */
        padding-left: 20px; /* 左パディング */
    }

    .carousel-card h3::before {
        content: '';
        position: absolute; /* 擬似要素の位置 */
        left: 0; /* 左側 */
        top: 50%; /* 中央に配置 */
        transform: translateY(-50%); /* 中央に配置 */
        height: 45px; /* 高さ */
        width: 10px; /* 幅 */
        background-color: #43B0C5; /* 色 */
    }

    .carousel-card p {
        font-size: 2.5vw; /* ビューポート幅に応じたフォントサイズ */
        margin: 10px 0; /* マージン */
        padding-left: 0px; /* 左パディングなし */
        text-align: justify; /* 両端揃え */
    }

    .carousel-card h3 span.small-text {
        font-size: 2vw; /* ビューポート幅に応じたフォントサイズ */
    }

  
    .carousel-card a.read-more {
        position: absolute;
        bottom: 15px;
        width: 200px; /* 幅を80%に設定 */
        max-width: 200px; /* 最大幅を280pxに設定（必要に応じて調整可能） */
        text-align: center;
        background-color: transparent;
        color: #707070;
        border: none;
        border-radius: 6px;
        font-weight: normal;
        text-decoration: none;
        box-sizing: border-box;
        transition: background-color 0.3s, color 0.3s;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 14px;
    }

    .low-carousel .carousel-card a.read-more {
        justify-content: end;
    }
    
    
    .carousel-card a.read-more .arrow {
        margin-left: 10px;
        font-size: 2vw;
    }
    
    .carousel-card a.read-more:hover {
        background-color: #f0f0f0;
        color: #707070;
    }
    
    .slick-dots {
        position: absolute !important;
        bottom: -40px !important; /* ドットの位置を調整 */
        left: 50% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
        width: 100% !important;
        z-index: 1 !important;
    }

    .carousel-control{
        display: none;
    }

    .slick-slide {
        margin-right: 0px;
        width: 100%;
    }

}

@media screen and (max-width: 430px) {
    .carousel-inner {
        min-height: 160px;
        padding: 10px 10px 0 10px; /* 内側の余白を設定 */
    }


    .carousel-card h3 {
        font-size: 3.8vw; /* ビューポート幅に応じたフォントサイズ */
        margin-bottom: 10px; /* 下マージン */
        padding-left: 10px; /* 左パディング */
    }

    .reroom-h3 h3 {
        font-size: 3.8vw; /* ビューポート幅に応じたフォントサイズ */
        margin-bottom: 10px; /* 下マージン */
        padding-left: 10px; /* 左パディング */
        line-height: 1.2;
    }

    .carousel-card h3::before {
        height: 21px; /* 高さ */
        width: 4px; /* 幅 */
    }

    .reroom-h3 h3::before {
        height: 40px; /* 高さ */
        width: 4px; /* 幅 */
    }
    .carousel-card p {
        font-size: 3vw; /* ビューポート幅に応じたフォントサイズ */
        margin: 10px 0; /* マージン */
        padding-left: 0px; /* 左パディングなし */
        text-align: justify; /* 両端揃え */
    }
    .carousel-card a.read-more {
        position: absolute;
        bottom: 15px;
        width: 200px; /* 幅を80%に設定 */
        max-width: 200px; /* 最大幅を280pxに設定（必要に応じて調整可能） */
        text-align: center;
        background-color: transparent;
        color: #707070;
        border: none;
        border-radius: 6px;
        font-weight: normal;
        text-decoration: none;
        box-sizing: border-box;
        transition: background-color 0.3s, color 0.3s;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 14px;
    }
  
    .carousel-card a.read-more .arrow {
        margin-left: 10px;
        font-size: 1.2em;
    }
    
    .carousel-card a.read-more:hover {
        background-color: #f0f0f0;
        color: #707070;
    }
    /* 右下に配置するimgタグ */
    .img-bottom-right {
        position: absolute;
        bottom: -60px; /* 下からの距離 */
        right: 0px; /* 右からの距離 */
        width: 180px; /* 必要に応じて調整 */
        height: auto;
    }

}

/* リンクボタンセクション */

.moving-background-section {
  position: relative;
  background-color: #E6E6E6;
  overflow: hidden;
}

    
.moving-background-section::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 220%; /* 横に2倍の幅を持たせる */
  height: 220px; /* SVGの高さを設定 */
  background: url(../img/renewal2024/background-scroll.svg) repeat-x;
  background-size: 50% auto; /* SVG画像のサイズを50%に設定 */
  animation: scrollBackground 100s linear infinite;
}

@keyframes scrollBackground {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%); /* 画像のサイズに合わせて動く */
  }
}
@media (min-width: 1400px) {

.moving-background-section::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 200%; /* 横に2倍の幅を持たせる */
    height: 180px; /* SVGの高さを設定 */
    background: url(../img/renewal2024/background-scroll.svg) repeat-x;
    background-size: 50% auto; /* SVG画像のサイズを50%に設定 */
    animation: scrollBackground 100s linear infinite;
    }
}

.container {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 20px;
}

.button-area-wrapper {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.button-area {
  width: 50%;
  background-color: rgba(128, 128, 128, 0.15); /* グレーの背景色、透過度30% */
  padding: 30px 20px 50px; /* 内側にパディングを追加 */
  position: relative;
  box-sizing: border-box; /* パディングとボーダーを含むサイズ計算 */
  margin: 30px 0;
}

h2.section-title,
h2.button-area-title {
  text-align: center;
  position: relative;
  width: 100%; /* 横幅いっぱいに広げる */
  font-weight: 200;
  font-size: 36px;
  line-height: 1.4;
}

.title-line {
  display: block;
  width: 23px; /* 青いラインの長さ */
  height: 3px; /* 青いラインの高さ */
  background-color: #43B0C5; /* 青いラインの色 */
  margin: 20px auto 0; /* 上下にマージンを追加し、中央揃え */
}

.title-line2 {
  display: block;
  width: 23px; /* 青いラインの長さ */
  height: 3px; /* 青いラインの高さ */
  background-color: #00AD99; /* 緑ラインの色 */
  margin: 20px auto 0; /* 上下にマージンを追加し、中央揃え */
}

.subtitle {
  display: block;
  font-size: 12px; /* 詩文のサイズ */
  color: #666; /* 詩文の色 */
  margin-top: 0px; /* 青いラインとの間隔 */
  font-weight: 400;
}

.button-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3列 */
  gap: 20px; /* ボタン間のスペース */
  margin-top: 30px;
}

.link-button {
  background-color: #43B0C5;
  color: #fff;
  border: none;
  padding: 0px 15px 0px 15px;
  text-align: center;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box; /* パディングを含むサイズ計算 */
  width: 100%;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease; /* 背景色とテキストのアニメーション */
  text-decoration: none;
  line-height: 1.5;
  letter-spacing: 0;
  height: 70px;
}

.link-button .arrow {
  font-size: 18px;
  transition: transform 0.3s ease; /* アニメーション時間を指定 */
}

.link-button:hover {
  background-color: #ffffff;
  color: #333;
}

.link-button:hover .arrow {
  transform: translateX(10px); /* ホバー時に15px右に移動 */
}

.link-button-right {
  background-color: #00AD99;
  padding-left: 40px;
}

.link-right{
    padding-left: 40px;
}

/* スマホ版のスタイルを追加 */
@media (max-width: 900px) {
  .moving-background-section {
    background-color: #E6E6E6; /* 背景色を白に設定 */
    overflow: visible; /* 画像背景を削除 */
    padding: 0 0 30px 0;
    height: auto;
  }

  .moving-background-section::before {
    display: none; /* 画像背景を非表示にする */
  }

  .button-area-wrapper {
    flex-direction: column;
    gap: 0px; /* ボタンエリア間のスペース */
  }

  .button-area {
    width: 100%;
    background-color: #ffffff; /* ボタンエリアの背景色を白に設定 */
    padding: 15px 15px 15px; /* 内側のパディングを調整 */
    margin: 30px 0 0;
  }

  .button-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2列のグリッドレイアウト */
    gap: 10px; /* ボタン間のスペースを狭く設定 */
    margin-top: 30px; /* 上部マージンを調整 */
  }

  .link-button {
    padding: 15px; /* パディングを調整 */
    font-size: 14px; /* フォントサイズを調整 */
  }
  .link-button:hover {
    background-color: #43B0C5;
    color: #fff;
    }

    .link-button-right:hover {
    background-color: #00AD99;
    color: #fff;
    }

     
    h2.section-title,
    h2.button-area-title {
        font-size: 6vw;
    }
}


/* サービス紹介セクションの共通スタイル */

.service-section {
    position: relative;
    margin: 80px 0;
    overflow: hidden; /* セクションを超えないように */
}

.content-wrapper {
    display: flex;
    justify-content: space-between;
    max-width: 1080px;
    margin: 0 auto;
    position: relative;
    z-index: 2; /* 既存のスタイル */
}

.gray-background {
    background-color: #f7f7f7; /* グレーの背景色 */
    position: absolute; /* 親要素に対して位置を決める */
    top: 0;
    left: 0;
    right: 0; /* 画面の幅全体に広げる */
    bottom: 0; /* 高さも親要素に合わせる */
    z-index: 0; /* 他の要素の後ろに配置する */
    opacity: 0;
    transition: opacity .5s ease-out, transform .5s ease-out;
    max-width: 1080px;
    margin: 0 auto;

}

/* フェードインする際のスタイル */
.gray-background.show {
    opacity: 1;
}



/* 背景グラデーション */
.blue-gradient, .green-gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 36vw; /* 左から36vwまで */
    height: 100%;
    pointer-events: none; /* コンテンツとの干渉を防ぐ */
}

.blue-gradient {
    background-color: #43B0C5;
    z-index: 1; /* 右側の背景が最下位 */
}

.green-gradient {
    background-color: #AAC7CC;
    z-index: 2; /* 左側の背景が最下位 */
}


.left-half,
.right-half {
    padding: 20px;
}

@media (min-width: 1400px) {
    .blue-gradient {
        width: 36vw;
    }
}


.left-half h3 {
    display: none; /* オーバーレイの上に配置するための相対位置指定 */
}


/* 各カラムのスタイル */

.left-half {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 30px 20px; /* パディングをそのままにします */
    z-index: 10!important; /* 最上位に表示 */
    position: relative; /* z-index が有効になるように */
    background-color: transparent; /* 背景色を持たせたくない場合 */
}


.left-half img {
    width: 377px;
    height: auto;
    margin-bottom: 10px;
}

.left-half h2::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 50px;
  width: 12px;
  background-color: #ffffff;
}

.left-half h2 {
    display: block;
    font-size: 24px;
    margin-bottom: 10px;
    position: relative;
    padding-left: 25px;
    font-weight: normal;
    line-height: 1.2;
    color: #ffffff;
    z-index: 10;
}

.left-half h2.support_h2 {
    top: 10px;
}

.left-half h2::before {
  content: '';
  position: absolute;
  left: 0;
  top: 52%;
  transform: translateY(-50%);
  height: 50px;
  width: 12px;
  background-color: #ffffff;
}

.left-half h2 span.small-text{
  font-size: 16px;
}

.service-section a.read-more-show {
    font-size: 18px;
    display: inline-flex;
    align-items: center;
    margin-top: 10px;
    color: #ffffff;
    text-decoration: none;
    margin-left: 150px; 
}

.service-section a.read-more-show:hover {
    color: #666666;
}

.service-section a.read-more-show .arrow {
    margin-left: 5px;
    transition: transform 0.3s ease;
}

.service-section a.read-more-show:hover .arrow {
    transform: translateX(5px);
}

.left-half, .right-half {
    flex: 1;
    box-sizing: border-box;
}

.right-half {
    width: 59%;
    opacity: 0;
    transform: translateY(20px); /* 少し下にずらしておく */
    transition: opacity 2s ease-out, transform 2s ease-out;
    padding: 50px 40px 0 0;
    z-index: 5; /* これを下げる */
}

#sublease.right-half {
    padding: 90px 40px 0 0;
}


/* フェードインする際のスタイル */
.right-half.show {
    opacity: 1;
    transform: translateY(0); /* 元の位置に戻す */
}


#sublease {
    padding: 60px 30px 0;
}

.right-half h3 {
    font-size: 20px;
    display: block;
    margin-bottom: 20px;
    position: relative;
    padding-left: 25px;
    font-weight: normal;
    line-height: 1.2;
}

.right-half h3::before {
  content: '';
  position: absolute;
  left: 0;
  top: 52%;
  transform: translateY(-50%);
  height: 40px;
  width: 12px;
  background-color: #43B0C5;
}

.right-half h3.secondh3::before {
  content: '';
  position: absolute;
  left: 0;
  top: 52%;
  transform: translateY(-50%);
  height: 40px;
  width: 12px;
  background-color: #579BDE;
}

.title-description {
    margin-top: 10px;
    font-size: 16px;
    color: #333;
    margin-bottom: 30px;
    text-align: justify;
}

.product-description {
    margin-top: 10px;
    font-size: 16px;
    color: #333;
}

.product-description li {
    padding-bottom: 10px;
}

/* メディアクエリ (レスポンシブ対応) */
@media (max-width: 900px) {
    .service-section {
        margin: 0;
        background-color: #ffffff; /* 白い背景色 */
        background: none; /* グラデーション背景を削除 */
        padding: 0;
    }

    /* レイアウトの順番を変更 */
    .content-wrapper {
        flex-direction: column;
    }

    /* 左側の要素 */
    .left-half {
        margin-bottom: 20px;
        position: relative; /* オーバーレイを画像の上に配置するための相対位置指定 */
        margin-left: 0;
        padding: 0;
    }

    .left-half img {
        width: 100%;
        height: auto;
        margin-bottom: 10px;
    }

    .left-half h2.reroom_h2,
    .left-half h2.support_h2 {
        display: none;
    }

    .left-half h3 {
        display: block; /* スマートフォン版で表示 */
        color: #333; /* h3の文字色を調整 */
        margin: 10px; /* マージンを調整 */
        padding: 0 10px; /* 左右のパディングを追加して内容を内側に配置 */
        width: calc(100% - 20px); /* ボックスサイズに合わせて幅を調整 */
        box-sizing: border-box; /* パディングやボーダーを含めたサイズ計算 */
        font-size: 4vw;
        text-align: center;
        position: relative; /* オーバーレイの上に配置するための相対位置指定 */
        z-index: 2; /* オーバーレイの上に表示させるためのz-index */
        font-weight: 400;
    }

    .service-section a.read-more-show {
        display: inline-flex;
        align-items: center;
        margin: 10px 0; /* 上下のマージンを調整 */
        color: #333; /* ボタンの文字色を調整 */
        text-decoration: none;
        border: 2px solid #333; /* ボタンにボーダーを追加 */
        border-radius: 5px;
        padding: 5px 20px; /* ボタンのパディングを調整 */
        background-color: #ffffff; /* ボタンの背景色を白に設定 */
        width: 75%; /* 幅を自動調整 */
        max-width: 350px; /* ボタンの最大幅を設定 */
        text-align: center; /* ボタン内のテキストも中央揃え */
        font-size: 4vw;
        box-sizing: border-box; /* パディングやボーダーを含めたサイズ計算 */
        margin-left: auto; /* 左右のマージンを調整して中央に配置 */
        margin-right: auto; /* 左右のマージンを調整して中央に配置 */
        justify-content: center;
    }

    .service-section a.read-more-show .arrow {
        margin-left: 5px;
        transition: transform 0.3s ease;
    }

    .service-section a.read-more-show:hover .arrow {
        transform: translateX(5px);
    }

    /* スマホでは非表示 */
    .right-half {
        display: none; /* 初期状態では非表示 */
    }
}

@media (max-width: 375px) {
    .left-half h2 {
        top: 25vh;
    }

    .left-half h2.support_h2 {
        top: 27vh;
    }
}



/* 最新情報セクション全体のスタイル */
.news-section {
    padding: 10px 0 50px;
    position: relative;
    z-index: 1;
    background-color: white;
    background: #F7F7F7;
}

/* 最新情報とNEWSのスタイル */
.news-heading {
    text-align: center; /* 中央揃え */
    margin: 0; /* デフォルトのマージンを削除 */
    padding: 0; /* デフォルトのパディングを削除 */
    position: relative; /* 横線を絶対位置で配置するために必要 */
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 30px;
}

/* NEWS部分のスタイル */
.news-heading span {
    display: block; /* 改行させるためにブロック表示 */
    font-size: 20px; /* 必要に応じてフォントサイズを調整 */
    font-weight: normal; /* 太字にする場合 */
    margin-top: 20px; /* NEWSの上にスペースを追加 */
    position: relative; /* 横線の位置を調整するために必要 */
}

#news_list{
	padding-top: 30px;
}


/* コンテンツ全体の幅を制限 */
.news_area {
    margin: 0 auto;
    max-width: 920px;
}

/* 各dl要素をフレックスボックスにして、dtとddを横並びに */
.news_area dl {
    display: flex;
    align-items: flex-start;
    margin: 5px 0;
    padding: 10px 0;
    border-top: 1px dotted #082440;
    position: relative;
}

.news_area dl a{
    text-decoration: none;
    color: #333333;
}


/* 最後のdl要素にボトムボーダーを追加 */
.news_area dl:last-child {
    border-bottom: 1px dotted #082440;
    padding-bottom: 15px;
}

/* dt要素をフレックスボックスとして、アイコンと日付を水平に配置 */
.news_area dt {
    display: flex;
    align-items: center;
    margin-right: 20px;
    position: relative;
}

/* NEWアイコンのスタイル */
.news_area .new-icon {
    background-color: orange;
    color: white;
    font-size: 12px;
    font-weight: bold;
    padding: 2px 6px;
    border-radius: 3px;
    margin-right: 10px;
    display: inline-block;
}

/* アイコンがない場合に表示する空のアイコンスタイル */
.news_area .empty-icon {
    display: inline-block;
    width: 40px; /* NEWアイコンと同じ幅 */
    margin-right: 10px; /* NEWアイコンと同じ余白 */
}

/* dd要素をフレックスで残りの幅を埋めるように設定 */
.news_area dd {
    flex-grow: 1;
    position: relative;
    padding-left: 25px; /* 点線のための余白 */
    padding-right: 150px;
    background: url(../img/renewal2024/news_arrows.png) no-repeat left top -2px ; /* 点線の画像 */
}

/* read-moreリンクを右端に配置 */
.news_area dd a.read-more {
    font-size: 16px;
    text-decoration: none;
    position: absolute;
    right: 10px;
    bottom: -3px;
}

.news_area dd a.read-more:hover {
    color: #00AD99;
}

/* アローの初期スタイルとトランジション設定 */
.news_area dd a.read-more .arrow {
    display: inline-block;
    margin-left: 5px;
    transition: transform 0.3s ease;
}

/* read-moreリンクにホバー時、矢印を右に移動 */
.news_area dd a.read-more:hover .arrow {
    transform: translateX(10px);
}



#group-efforts {
    max-width: 1080px;
    margin: 35px auto;
}

@media (max-width: 900px) {
    /* 最新情報セクション全体のスタイル */
    .news-section {
        padding: 3px 0;
        margin-top: 30px;
        background-color: #F7F7F7;
    }

    /* 最新情報とNEWSのスタイル */
    .news-heading {
        font-size: 20px;
        margin-bottom: 20px;
    }

    /* NEWS部分のスタイル */
    .news-heading span {
        font-size: 14px;
        margin-top: 10px;
    }

    /* 横線のスタイル */
    .news-heading::before {
        width: 20px;
        height: 2px;
        top: 50%;
    }

    /* コンテンツ全体の幅を制限 */
    .news_area {
        margin: 0 auto;
        max-width: 100%;
    }

    /* 各dl要素をフレックスボックスにして、dtとddを縦に並べる */
    .news_area dl {
        display: block;
        margin: 10px 0;
        padding: 15px 0 10px;
        border-top: 1px dotted #082440;
        position: relative;
    }

    /* 最後のdl要素にボトムボーダーを追加 */
    .news_area dl:last-child {
        border-bottom: 1px dotted #ccc;
        padding-bottom: 15px;
    }

    /* dt要素を縦に並べる */
    .news_area dt {
        display: block;
        margin-bottom: 5px;
        position: relative;
        font-size: 14px; /* スマホ用にフォントサイズを調整 */
    }

    /* NEWアイコンのスタイル */
    .news_area .new-icon {
        background-color: orange;
        color: white;
        font-size: 10px;
        font-weight: bold;
        padding: 2px 5px;
        border-radius: 3px;
        margin-right: 5px;
        display: inline-block;
    }

    /* アイコンがない場合のスペース調整 */
    .news_area dt {
        padding-left: 18px; /* アイコンの幅 + 余白 */
    }

    /* dd要素を縦に並べる */
    .news_area dd {
        position: relative;
        padding-left: 20px; /* 点線のための余白 */
        padding-right: 40px;
        background: url(../img/renewal2024/news_arrows.png) no-repeat left top -2px ; /* 点線の画像 */
        margin-left: 20px;
    }

    /* read-moreリンクのテキストを非表示にし、>だけを表示 */
    .news_area dd a.read-more {
        font-size: 16px;
        text-decoration: none;
        position: absolute;
        right: 10px;
        bottom: 20px;
        color: #333; /* 横線の色と統一 */
    }

    /* read-moreリンクのテキストを非表示 */
    .news_area dd a.read-more::after {
        content: '>';
        font-size: 16px;
        margin-left: 5px;
    }

    /* read-moreリンク内のテキストと矢印を非表示 */
    .news_area dd a.read-more span.arrow {
        display: none;
    }

    .news_area dd a.read-more {
        font-size: 0; /* テキストを隠す */
    }
    /* アイコンがない場合に表示する空のアイコンスタイル */
    .news_area .empty-icon {
        display: inline-block;
        width: 0px; /* NEWアイコンと同じ幅 */
        margin-right: 0px; /* NEWアイコンと同じ余白 */
    }

}


footer {
    color: #fff;
    text-align: center;
    padding: 20px 0;
}


/* 1480px以下でのスタイル */
@media (max-width: 1400px) {

    .header-left img:nth-child(2) {
        width: 200px;
    }

    .global_menu ul li a {
        padding: 0 10px;
        padding-bottom: 20px;
    }

    .container {
        max-width: 1100px;
    }

    .content-area {
        max-width: 1100px;
    }

    .top-search .button-group {
        max-width: 1100px; /* 3つのボタンの幅が合計1290px */
    }

    .button-text {
        font-size: 1.3vw;
    }


    .content-wrapper {
        max-width: 1080px;
    }

    .blue-gradient {
        background: linear-gradient(to right, #43B0C5 33vw, #F7F7F7 33vw);
    }

    .green-gradient {
        background: linear-gradient(to right, #AAC7CC 33vw, #F7F7F7 33vw);
    }

    .left-half{
        margin-left: 0%;
    }

    .link-button {
        padding: 0px 15px 0px 30px;
        text-align: center;
        font-size: 12px;
        }
    .link-button-right {
        padding-left: 50px;
        }
        
    .link-right{
            padding-left: 40px;
        }
    
}

/* 1480px以下でのスタイル */
@media (max-width: 1280px) {

    /* ボタンのベーススタイル */
    .blue-button {
        width: 23vw; /* 幅 */
        height: 50px; /* 高さ */
    }

}
/* 1250px以下でのスタイル */
@media (max-width: 1250px) {

    .global_menu ul li a {
        font-size: 12px;
    }
}

/* 1100px以下でのスタイル */
@media (max-width: 1100px) {
    .search-inner {
        position: relative;
        left: 20px;
        box-sizing: border-box;
        display: inline-block;
    }
}
/* 768px以下でのスタイル */
@media (max-width: 900px) {
   

    .header-contact {
        flex-direction: column;
        text-align: center;
    }

    .global_menu ul {
        flex-direction: column;
    }

    .service-items {
        flex-direction: column;
        align-items: center;
    }


    section {
        /*padding: 20px 10px;*/ /* セクション内のパディングを調整 */
        margin: 0 auto; /* 必要に応じて中央揃え */
        max-width: 100%; /* セクション全体をデバイス幅に合わせる */
    }

    .services .content-area {
        max-width: 100%; /* 幅を全幅に設定 */
        padding: 10px; /* パディングを縮小 */
        margin: 0 auto; /* 中央揃え */
    }

}

br.br-pc {
    display: block;
}

br.br-sp {
    display: none;
}

@media (max-width: 900px) {

    br.br-pc {
        display: none;
    }
    br.br-sp {
        display: block;
    }
    .gray-background {
        background: none;
    }
    .blue-gradient {
        background: none;
    }

    .green-gradient {
        background: none;
    }

}

/* 900px以下の表示 */
@media (max-width: 900px) {
    .hero {
        display: none; /* 動画と検索インターフェイスを非表示 */
    }

    .top-search {
        margin-top: 120px;
        padding: 0; /* セクション全体のパディングを削除 */
        background-color: #f0f0f0;
        box-sizing: border-box;
    }

    .top-search .content-area {
        padding: 20px;
        background-color: #ffffff!important;
    }

    .top-search .button-group {
        display: flex;
        flex-direction: column; /* ボタンを縦並びに */
        gap: 10px; /* ボタン間のスペース */
    }

    .top-search .blue-button {
        width: 93%; 
        height: 60px;
        padding: 0px 20px 0px 30px;
        background-color: #00AD99;
        color: white;
        border: none;
        border-radius: 5px;
        font-size: 2vw;
    }

    .button-text {
        font-size: 4vw;
    }

    #buttonB .icon-left #base,
    #buttonB .icon-left #left-part,
    #buttonB .icon-left #right-part,
    #buttonB .icon-left #center-part {
        fill: #00AD99 !important; /* 車輪部分、左パーツ、右パーツの色 */
    }

    /* アイコンの左側スタイル */
    .icon-left {
        width: 30px;
        height: 35px;
        transition: all 0.5s ease;
    }

    .icon-right {
        width: 25px;
        height: 25px;
    }

    #buttonC #group-352 {
        width: 30px;
        height: 35px;
        transition: all 0.5s ease;
    }

    .top-search .container-wrapper {
        width: 100%; /* 親要素を全幅に */
        margin-top: 20px;
        box-sizing: border-box;
    }

    .top-search .search-containerSP {
        width: 100vw; /* ビューポート幅いっぱいに広げる */
        margin-left: calc(-50vw + 50%); /* 左右のマージンを調整して全幅に */
        padding: 20px 30px;
        background-color: #f0f0f0;
        box-sizing: border-box;
        clip-path: none; /* 斜めカットを解除 */
        display: block;
        height: 18vh;
    }

    /* 検索フォームのテキストボックスのスタイル */
    #freeWordSP {
    /*width: calc(100% - 130px);*/ /* ボタンを除いた残りの幅 */
    width: 100%!important;
    padding: 10px; /* 内側の余白 */
    font-size: 16px; /* 文字サイズ */
    border: 2px solid #ccc; /* 枠線 */
    border-radius: 5px; /* 角の丸み */
    margin-right: 10px; /* ボタンとの間隔 */
    box-sizing: border-box; /* パディングを含む幅計算 */
    transition: border-color 0.3s ease; /* ホバー時のアニメーション */
    color: #333333;
    }

    /* テキストボックスのホバー・フォーカス時のスタイル */
    #freeWordSP:focus {
    border-color: #43B0C5; /* フォーカス時の枠線色 */
    outline: none; /* デフォルトのフォーカス枠を削除 */
    }

    /* 検索ボタンのスタイル */
    #btnSearch2 {
    background-color: #43B0C5; /* 背景色 */
    color: white; /* テキスト色 */
    padding: 15px 30px; /* 内側の余白 */
    border: none; /* 枠線なし */
    border-radius: 5px; /* 角の丸み */
    font-size: 18px; /* 文字サイズ */
    cursor: pointer; /* カーソル変更 */
    transition: background-color 0.3s ease; /* ホバー時のアニメーション */
    }

/* 検索ボタンのホバー時のスタイル */
    #btnSearch2:hover {
    background-color: #357a85; /* ホバー時の背景色 */
    }

    .top-search .message-container {
        width: 100%;
        margin-top: 0px;
        background-color: #fff;
        padding: 20px 20px 0;
        box-sizing: border-box;
        text-align: center;
    }

    .top-search .message-container h2,
    .top-search .message-container h3 {
        margin: 0 0 10px;
    }

    #news_list{
        padding-top: 15px;
    }

}


/* 430px以下の表示 */
@media (max-width: 430px) {

    .top-search .blue-button {
        width: 87%; 
        height: 60px;
        padding: 0px 20px 0px 30px;
    }
    .button-text {
        font-size: 5vw;
    }
    h2.section-title,
    h2.button-area-title {
        font-size: 8vw;
    }
    .top-search .message-container h2 {
        margin: 0 0 10px;
        font-size: 5.5vw;
        font-feature-settings: "palt";
    }

    .top-search .message-container h3 {
        margin: 0 0 10px;
        font-size: 3.5vw;
        letter-spacing: 0;
        font-feature-settings: "palt";
    }


}
/* 375px以下の表示 */

@media (max-width: 375px) {

    .top-search .blue-button {
        width: 85%; 
        height: 60px;
        padding: 0px 20px 0px 30px;
    }

    .top-search .search-containerSP {
        height: 20vh;
    }


}


/* 下層ページ */

#lower_title_box {
    width: 1080px;
    background: url(../img/eria_title.gif) no-repeat;
    margin-left: 20px;
    height: 40px;
    overflow: hidden;
}

#search_title_box {
    width: 100%;
    background: #E6E6E6;
    overflow: hidden;
}

.head_contents{/* 20241210 */
	width: 1080px;
	overflow: hidden;
	margin: 0 auto 0;
}

.head_contents h1 {/* 20241213 */
    padding: 50px 0;
    text-align: center;
    font-size: 30px;
    display: flex;
    align-items: center; /* 縦方向の中央揃え */
    justify-content: center; /* 横方向の中央揃え */
    gap: 10px; /* 画像とテキストの間に適切なスペース */
    font-weight: normal;
}

.head_contents h1 img {/* 20241213 */
    display: inline-block; /* 必要に応じて */
    height: 1.5em; /* 画像の高さをテキストのサイズに調整 */
    vertical-align: middle; /* テキストラインとの整合性を取る場合 */
}

/* 詳細ページ 20241225 */
#detail_title_box {
    width: 100%;
    background: #009AAE;
    overflow: hidden;
}
.detail_head_contents  {
    margin: 0 auto;
    width: 1080px;
}

.detail_head_contents h1 {
    padding: 20px 0;
    text-align: left;
    font-size: 28px;
    font-weight: 400;
    color: #ffffff;
}

#details_contents {
    width: 100%;
    padding: 10px;
    /*
    background: #f9f9f9;
    */
    margin-bottom: 50px;
    border: none;
}

#details_contenst_top {
    width: 740px;
    height: 44px;
    overflow: hidden;
    background: url(../img/details_title_bar.png) no-repeat;
}

#details_contenst_top h2 {
    /*	width: 350px;*/
    float: left;
    color: #fff;
    font-size: 18px;
    padding: 5px 0 0 20px;
    font-weight: normal;
}

.management_number {
    color: #fff;
    margin: 5px 15px 0 0;
}

#details_contenst_top dl {
    padding-top: 10px;
    float: right;
    text-align: right;
    font-size: 14px;
    font-weight: bold;
}

#details_contenst_top dt {
    float: left;
}

#details_contenst_top dd {
    float: left;
}

.middle_eria {
    width: 740px;
    overflow: hidden;
    margin-bottom: 20px;
}

.image_eria {
    width: 100%;
    display: flex;
}

.image_eria_jigyo {
    width: 350px;
    float: left;
}

/* お部屋の間取り・写真 */
section.room_photos{

}


/* 周辺情報 */
section.surrounding_info{
    margin-top: 100px;
}

/* 部屋の特徴・設備 */
section.room_features{
    margin-top: 100px;
}

/* 20241226 設備リスト */

ul.details_room_point{
    width: 70%;
    display: inline-block;
    margin-top: 20px;
}

ul.details_room_point li{
    border: none!important;
    float: left;
    text-align: center;
    padding: 5px 0;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    color: #FFF;
    font-size: 14px!important;
    font-weight: normal!important;
    display: block;
    width: 142px;
    margin-right: 7px;
    margin-bottom: 7px;
}

ul.details_room_point li.liOn {
    background: #009AAE;
}
ul.details_room_point li.liOff {
    background: #E4F0F2!important;
}

/* 新dl_table 20241225 */
.dl_table {
    width: 99%;
    font-size: 16px;
    line-height: 1.6;
    border-collapse: collapse;
    border: 1px solid #ddd;
    margin-top: 20px;
}

.dl_table .row {
    display: flex;
    width: 100%;
    border-bottom: 1px solid #ddd;
}

.dl_table .row:last-child {
    border-bottom: none;
}

.dl_table .column {
    width: 50%;
    padding: 0 10px;
}

.dl_table .column.full-width {
    width: 100%;
}

.dl_table dl {
    display: flex;
    margin: 0;
}

.dl_table dt {
    width: 200px;
    text-align: left;
    color: #009AAE;
    padding: 10px 0 10px 20px;
}

.dl_table dd {
    width: auto;
    text-align: left;
    color: #333;
    padding: 10px 0 10px 0px;
    margin: 0;
}

.dl_table .big {
    font-size: 18px;
    font-weight: bold;
    color: #a50600; /* 赤色 */
}

/* 偶数行と奇数行の背景色を交互にする */
.dl_table .row:nth-child(even) {
    background-color: #F7FBFC;
}

/* 偶数行と奇数行の背景色を交互にする */
.dl_table-glay .row:nth-child(even) {
    background-color: #f9f9f9;
}



/*h3をh2に変更*/


h2.title_room_photo_map {
    width: 100% !important;
    padding: 0px 0 0 0px;
    font-size: 24px;
    font-weight: normal;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}


h2.title_room_photo_map span.vertical-line,
h2.details_room_title span.vertical-line {
    display: inline-block;
    width: 10px;
    height: 37px;
    background-color: #00A0C6;
    margin-right: 10px;
}

h2.details_room_title span.vertical-line-glay {
    display: inline-block;
    width: 10px;
    height: 37px;
    background-color: #959595;
    margin-right: 10px;
}


h2.title_room_photo_map_jigyo {
    width: 100% !important;
    padding: 0px 0 0 0px;
    font-size: 24px;
    font-weight: normal;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}


/* 基本データ */
section.details_basic_data{
    margin-top: 100px;
}

/* アコーディオンタイトル */
h2.details_room_title {
    width: 100%;
    padding: 0;
    font-size: 24px;
    font-weight: normal;
    display: flex; /* 子要素を横並びに */
    align-items: center; /* 縦方向の中央揃え */
    margin-bottom: 10px;
    position: relative; /* 絶対位置のアイコンを制御可能に */
    cursor: pointer;
}

h2.details_room_title .vertical-line {
    display: inline-block;
    width: 4px;
    height: 20px;
    background-color: #009aae;
    margin-right: 10px;
}

h2.details_room_title .toggle-icon {
    position: absolute; /* 右端に絶対配置 */
    right: 10px; /* 右端からの余白 */
    top: 50%; /* 縦方向中央揃え */
    transform: translateY(-50%); /* 縦方向の中央揃えを補正 */
    transform-origin: center center; /* 回転の基点を中央に設定 */
    font-size: 16px;
    color: #00A0C6;
    transition: transform 0.3s ease;
}

/* 20250205 仮デザイン */
h2.details_room_title .toggle-iconB {
    display: inline-block!important; /* インラインブロックで隣に配置 */
    font-size: 16px;
    color: #00A0C6;
    transition: transform 0.3s ease;
    line-height: 1; /* 縦方向のずれを防ぐ */
    transform: translateY(-50%); /* 縦方向の中央揃えを補正 */
    transform-origin: center center; /* 回転の基点を中央に設定 */
    align-self: center; /* フレックスアイテムとして中央揃え */
    margin-left: 20px;
    margin-top: 16px;
}

h2.details_room_title .toggle-iconC {
    position: absolute; /* 右端に絶対配置 */
    right: 10px; /* 右端からの余白 */
    top: 50%; /* 縦方向中央揃え */
    transform: translateY(-50%); /* 縦方向の中央揃えを補正 */
    transform-origin: center center; /* 回転の基点を中央に設定 */
    font-size: 16px;
    color: #00A0C6;
    transition: transform 0.3s ease;
    background: #eee;
    padding: 10px;
}


h3.details_room_title_sub {
    width: 100%;
    padding: 0;
    font-size: 20px;
    font-weight: normal;
    display: flex; /* 子要素を横並びに */
    align-items: center; /* 縦方向の中央揃え */
    margin-top: 20px;
    margin-bottom: 10px;
    cursor: pointer;
}

h3.details_room_title_sub .toggle-icon {
    display: inline-block; /* インラインブロックで横並びに */
    margin-left: 8px; /* 文字との間隔調整 */
    font-size: 16px;
    color: #00A0C6;
    transition: transform 0.3s ease;
    line-height: 1; /* 縦方向のずれを防ぐ */
    transform-origin: center center; /* 回転の基点を中央に設定 */
}

/* 開閉時の回転 */
h3.details_room_title_sub.open .toggle-icon {
    transform: rotate(180deg); /* 回転のみ適用 */
}

/* アコーディオンが開いている場合 */
h2.details_room_title.open .toggle-iconC,
h2.details_room_title.open .toggle-iconB,
h2.details_room_title.open .toggle-icon {
    transform: translateY(-50%) rotate(180deg); 
}

/* アコーディオンコンテンツ */
.accordion_content {
    padding: 0;
    display: block; /* デフォルトで開いた状態 */
    transition: max-height 0.3s ease, padding 0.3s ease;
    overflow: hidden;
}

/* デフォルトの状態を非表示にする */
.collapsed {
    display: none;
}

/* 開いた状態のスタイルを設定 */
.open + .details_room_content {
    display: block;
}



/* 物件オススメポイント */
section.recommendation{
    margin-top: 100px;
    background: #E4F0F2;
    padding: 15px 15px;
    border: 1px solid #009AAE;
    width: 96%;
}

.details_info_text_inbox_01 {
}

.details_info_text_inbox_01_low {
    width: 100%;
    margin-right: 0px;
}

.details_info_text_inbox_01 h2 {
    padding-top: 5px !important;
    margin-top: 0 !important;
    margin-bottom: 5px !important;
    font-size: 20px !important;
    font-weight: normal;
    color: #009AAE;
    width: 100%;
    display: flex;
    align-items: center;
}

.details_info_text_inbox_01 h2 span.vertical-line {
    display: inline-block;
    width: 6px;
    height: 30px;
    background-color: #00A0C6;
    margin-right: 10px;
}


.details_info_text_inbox_01 ul {
    float: left;
    width: 500px;
}

.details_info_text_inbox_01 a {
    float: right;
    margin-right: 15px;
}

.details_info_text_inbox_02 {
    background: #fffbec;
    padding: 5px 5px;
    display: inline-block;
    /*margin-bottom: 15px;*/
    width: 100%;
}

.details_info_text_box_01 {
    display: flex;
    justify-content: space-between; /* 左右配置 */
    align-items: center; /* 縦方向の中央揃え */
    min-height: 100px;
}

.details_info_text_inbox_01 {
    flex: 1; /* 左側のh2とulを保持 */
}

.details_info_text_inbox_contact {
    display: flex;
    align-items: flex-start; /* 上に寄せる */
    justify-content: center;
    width: 450px; /* 必要な幅だけ使用 */
}

.details_info_text_inbox_contact button{
    background-color: #00AD99;
    border: 1px solid #00AD99;
    color: white;
    border-radius: 5px;
    padding: 18px 15px 15px!important;
    font-size: 20px;
    font-weight: 300;
    cursor: pointer;
    transition: background-color 0.3s ease;
    width: 90%;
}

.detail_mail_btn {
    display: inline-flex; /* アイコンとテキストを横並びにする */
    align-items: center; /* 縦方向の中央揃え */
    padding: 10px 20px; /* ボタンの余白 */
    font-size: 16px; /* 文字サイズ */
    font-weight: bold; /* 太字 */
    text-decoration: none; /* 下線を消す */
    color: #fff; /* 文字色 */
    background-color: #00AD99; /* ボタン背景色 */
    border-radius: 5px; /* 角丸 */
    border: none; /* 枠線なし */
    transition: background-color 0.3s ease; /* ホバーアニメーション */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* ドロップシャドウ */

}

.detail_mail_btn img {
    width: 24px; /* アイコンの幅 */
    height: 24px; /* アイコンの高さ */
}

.detail_mail_btn:hover {
    opacity: 0.7;
    text-decoration: none; /* ホバー時に下線を付ける */
}

/* 建物について */
section.article_text{
    margin-top: 100px;
}

/* お問い合わせセクション */
section.detail_contact {
    margin-top: 100px;
    background: #E4F0F2;
    padding: 30px 10px;
}


.detail_contact_inbox {
    display: flex; /* フレックスボックスで横並び */
    justify-content: center; /* 子要素を左右中央揃え */
    align-items: center; /* 縦方向の中央揃え */
    gap: 20px; /* ボタン間のスペース */
    flex-wrap: wrap; /* 必要に応じて折り返し */
}

/* ボタンホバー時のスタイル */
.detail_contact_inbox button:hover,
.reset_btn li button:hover {
    background-color: #fff; /* ホバー時の背景色 */
    color: #009AAE; /* ボタンの文字色 */
    border: 1px solid #009AAE; /* ボーダー */
}

/* お問い合わせボタン */
.detail_contact_inbox button {
    background-color: #00AD99; /* ボタンの背景色 */
    border: 1px solid #00AD99; /* ボーダー */
    color: white; /* ボタンの文字色 */
	border-radius: 5px; /* 角丸 */
    padding: 18px 30px 15px; /* ボタンの内側余白 */
    font-size: 20px; /* 文字サイズ */
	font-weight: 300;
    cursor: pointer; /* カーソルをポインターに */
    transition: background-color 0.3s ease; /* ホバー時のアニメーション */
}

/* ボタンホバー時のスタイル */
.detail_contact_inbox button:hover {
    background-color: #fff; /* ホバー時の背景色 */
    color: #00AD99; /* ボタンの文字色 */
    border: 1px solid #00AD99; /* ボーダー */
}

.detail_contact_inbox button svg{
	vertical-align: middle;
	padding-right: 10px;
    padding-bottom: 3px;
}




.detail_contact_inbox h3 {
    width: auto;
    font-size: 24px;
    color: #009AAE;
    font-weight: normal;
    margin-top: 4px;
}


.detail_contact_inbox img.detail_contact_banner{
    width: 200px;
}


.detail_contact_btn {
    display: inline-flex; /* アイコンとテキストを横並びに */
    align-items: center; /* アイコンとテキストを縦方向中央揃え */
    padding: 10px 20px; /* ボタンの余白 */
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    color: #fff;
    background-color: #007bff; /* ボタン背景色 */
    border-radius: 5px; /* 角丸 */
    border: none;
    transition: background-color 0.3s ease; /* ホバーアニメーション */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* ドロップシャドウ */

}

.detail_contact_btn img {
    margin-right: 0px; /* アイコンとテキストの間隔 */
    width: 24px; /* アイコンの幅 */
    height: 24px; /* アイコンの高さ */
}

.detail_contact_btn:hover {
    opacity: 0.7;; /* ホバー時の背景色 */
}





/* その他の部屋 */
section.other_rooms{
    margin-top: 100px;
}




h2.other_rooms_title {
    width: 100% !important;
    padding: 0px 0 0 0px;
    font-size: 18px;
    font-weight: normal;
    display: flex;
    align-items: center;
    margin: 0px;
    background: #eee;
}

h2.other_rooms_title span.vertical-line {
    display: inline-block;
    width: 6px;
    height: 36px;
    background-color: #00A0C6;
    margin-right: 10px;
}

.other_details {
    width: 100%;
    overflow: hidden;
    margin-bottom: 20px;
    /*border: 1px solid #E6E6E6;*/
}

.prejudice_housing{
    display: flex;
    flex-wrap: wrap;
    padding: 15px 0 0;
    gap: 15px;
    justify-content: flex-start; /* 均等配置 */
}

.prejudice_housing_link {
    display: block;
    text-decoration: none; /* リンクの下線を消す */
    color: inherit; /* 文字色を元のスタイルに */
}

.prejudice_housing_link:hover {
    opacity: 0.8; /* ホバー時の視覚効果 */
}


.prejudice_housing_one {
    /*flex-grow: 1;  フレックスアイテムが均等に伸びるように */
    flex-basis: calc(30% - 10px)!important;
    height: 150px;
    padding: 15px 15px 10px;
    margin-right: 5px;
    background: #fff;
    border: 1px solid #E6E6E6;
    transition: all 0.3s ease-in-out; /* アニメーションを追加 */
}

.prejudice_housing_one:hover {
    background: #e9e9e9;
    cursor: pointer;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); /* 影をつける */

}

.prejudice_housing_one_01 {
    background-image: none !important;
}

.prejudice_housing_one h4 {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-size: 18px;
    font-weight: bold;
}

.prejudice_housing_one h4 a{
    color: #333333;
    text-decoration: none;
}

.prejudice_housing_text{
    margin-top: 10px;
}



/* 20241213 */
.serch_box_in_01 {
    padding: 5px 20px 5px 20px;
    font-size: 15px;
    font-weight: bold;
    overflow: hidden;
}

.serch_box_in_01 p {
    float: left;
}

.serch_box_in_01-station {
    padding: 5px 20px 5px 0px;
    font-size: 15px;
    font-weight: bold;
    overflow: hidden;
}

.serch_box_in_01-station p {
    float: left;
}

.serch_box_in_01 p,
.serch_box_in_01-station p {
    display: flex; /* 横並びに配置 */
    padding-top: 0px;
    font-size: 18px; /* テキストのサイズ */
    font-weight: normal;
    margin-bottom: 30px;
    margin-top: 10px;
}

.serch_box_in_01 p span,
.serch_box_in_01-station p span {
    display: inline-block; /* インラインブロックで横並びに */
    width: 20px; /* ラベルの幅を固定 */
    color: #333333; /* ラベルの色 */
    margin-right: 5px; /* ラベルと入力フィールドの間隔 */

}

.reset_btn_aria {
    list-style: none; /* liのデフォルトスタイルを削除 */
    padding: 0;
    margin: 0;
    display: flex; /* 横並びに配置 */
    gap: 10px; /* ボタン間の余白 */
}

.reset_btn_aria ul {
    margin-left: 30px;
}

.reset_btn_aria li {
    display: inline-block; /* 必要に応じて調整 */
}
.reset_btn_aria button {
    margin-top: 10px;
    background-color: #E4F0F2; /* ボタンの背景色 */
    border: none;
    padding: 5px 20px; /* ボタン内の余白 */
    font-size: 14px; /* テキストのサイズ */
    color: #333; /* テキストの色 */
    cursor: pointer; /* ホバー時のカーソル変更 */
    transition: background-color 0.3s, color 0.3s; /* ホバー時のアニメーション */
    font-family: 'Noto Sans JP', sans-serif;
}

.reset_btn_aria button:hover {
    background-color: #e0e0e0; /* ホバー時の背景色 */
    color: #000; /* ホバー時のテキスト色 */
}

.detail_search_h3 {
    margin: 0;
    font-size: 20px;
    color: #009AAE;
    font-weight: normal;
    display: flex; /* 横並びにする */
    align-items: center; /* アイコンと文字を中央揃え */
    gap: 5px; /* アイコンと文字の間隔 */
}

.reset_btn_aria li:hover {
    background: none!important;
}

/* map 20241218 */
#map_canvas{
    width: 730px;
    height: 500px;
    float: left;
    position: relative;
    overflow: hidden;
}

/* 20250127 */
h3.details_room_title_sub {
    position: relative; /* アイコンを配置するために親要素を基準に */
    background: #F8F8F8;
    transition: background-color 0.3s ease; /* 背景色のアニメーション */
    padding: 10px 15px!important;
    width: 96.5%;
}

.details_room_title_sub:hover {
	background: #f1f1f1;
}









/*-------------search---------------*/

/* area search 20241212 */

@media (max-width: 765px) {

    #top-breadcrumb {
        overflow-x: auto; /* 横方向のスクロールを有効化 */
        white-space: nowrap; /* 内容を折り返さず横並びに表示 */
        margin: 130px auto 0;
        padding: 10px 20px;
        width: 100%; /* スマホ画面幅に対応 */
        box-sizing: border-box; /* パディングを含めた幅の計算 */
    }

    #detail-breadcrumb,
    #lower-breadcrumb {
        overflow-x: auto; /* 横方向のスクロールを有効化 */
        white-space: nowrap; /* 内容を折り返さず横並びに表示 */
        margin: 60px auto 0;
        padding: 10px 20px;
        width: 100%; /* スマホ画面幅に対応 */
        box-sizing: border-box; /* パディングを含めた幅の計算 */
    }

    #detail-breadcrumb .crumbs{
        display: none;
    }


    #top-breadcrumb li,
    #lower-breadcrumb li,
    #detail-breadcrumb li {
        margin-right: 10px; /* 各要素の間隔を調整 */
    }

    .head_contents {
        width: 100%!important;
        overflow: hidden;
        margin: 0 auto 0;
    }

    .head_contents h1 {
        padding: 15px 20px;
        font-size: 18px;
        text-align: justify;
        letter-spacing: 0px;
        line-height: 1.3;
    }

    .head_contents h1 img {/* 20250124 */
        height: 2em; /
    }

    #area_contents-2024{/* 20241212 */
        width: 100%!important;
        overflow: hidden;
        padding: 0px!important;
        margin: 0 20px 0;
    }

    #lower_contents-2024{/* 20250410 */
        width: auto!important;
        overflow: hidden;
        padding: 0 20px 0!important;
        margin: 0 20px 0;
    }

    #lower_contents-2024-full{/* 20250424 */
        width: auto!important;
        overflow: hidden;
        padding: 0!important;
        margin: 0;
    }

    
    #main_contents-2024 {
        width: 100%!important;
        padding-left: 0px;
        margin-top: 7px;
        padding: 0;
    }

    /*20241213*/
    .serch_box_in_02 ul.list {
        display: flex; /* Flexboxを有効化 */
        flex-wrap: wrap; /* 子要素を折り返す */
        gap: 20px; /* 子要素間のスペースを設定 */
        padding: 0 0 0 0px; /* 必要に応じて */
        margin: 0 0 30px 0; /* 必要に応じて */
        list-style: none; /* 必要に応じてリストのデフォルトスタイルを無効化 */
    }

    .serch_box_in_02 ul.list li {
        flex: 0 0 47%; /* 幅を固定（200px） */
        box-sizing: border-box; /* パディングやボーダーを含めた幅計算 */
    }

    .serch_box_in_02 ul.list li a {
        
    }


    /*20241218*/
    div.serch_box_in_03 {
        background: none;
        padding: 0px 0px;
        overflow: hidden;
        margin-bottom: 20px;
        width: 100%;
    }

    .serch_box_in_03 ul.list {
        display: flex;
        flex-wrap: wrap;
        gap: 10px !important;
        padding: 0 !important;
        margin: 0 0 30px 0 !important;
        list-style: none;
    }

    .serch_box_in_03 ul.list li {
        flex: 0 0 45% !important;
        box-sizing: border-box;
    }

    /* 長い路線名だけ1列（100%幅）に */
    .serch_box_in_03 ul.list li.single {
        flex: 0 0 100% !important;
    }
    .serch_box_in_03 ul.list li a {
        text-align: left!important;
    }

    /* 20241218 */
    #search_inbox_train {
        padding: 0 0px;

    }

    #search_inbox_train .search_result_list_box_top,
    #search_inbox_train .area_ui-tabs-nav {
        /*padding: 0 20px!important;*/
        width: auto!important;
    }

    #search_inbox_train .serch_box_in_01 {
        padding: 5px 0px 5px 0px;
        font-size: 15px;
        font-weight: normal;
        overflow: hidden;
    }

    .serch_box_in_01 p,
    .serch_box_in_01-station p {
        display: flex; /* 横並びに配置 */
        padding-top: 0px;
        font-size: 16px; /* テキストのサイズ */
        font-weight: normal;
        margin-bottom: 0px;
        margin-top: 10px;
        width: 100%;
    }

    #search_inbox_train ul.reset_btn_aria {
    }

    #search_inbox_train ul.reset_btn_aria li {
        float: left;
        width: 110px;
        padding: 0;
    }



    .reset_btn_aria {
        list-style: none; /* liのデフォルトスタイルを削除 */
        padding: 0;
        margin: 0;
        display: inline-block; /* 横並びに配置 */
        gap: 10px; /* ボタン間の余白 */
    }

    .reset_btn_aria ul {
        margin-left: 30px;
    }

    .reset_btn_aria li {
        display: inline-block; /* 必要に応じて調整 */
    }

    .reset_btn_aria button {
        margin-top: 10px;
        background-color: #E4F0F2; /* ボタンの背景色 */
        border: none;
        padding: 5px 20px; /* ボタン内の余白 */
        font-size: 14px; /* テキストのサイズ */
        color: #333; /* テキストの色 */
        cursor: pointer; /* ホバー時のカーソル変更 */
        transition: background-color 0.3s, color 0.3s; /* ホバー時のアニメーション */
    }

    .reset_btn_aria button:hover {
        background-color: #e0e0e0; /* ホバー時の背景色 */
        color: #000; /* ホバー時のテキスト色 */
    }


    div.serch_box_in_02 {
        margin-top: 30px;
        background: none;
        padding: 0px 20px;
        overflow: hidden;
        margin-bottom: 20px;
    }


    #search_inbox_train .reset_btn {
        border: none !important; /* 枠線を無効化 */
        background: #E4F0F2; /* 背景色 */
        margin: 0; /* 外側の余白を削除 */
        padding: 0; /* 内側の余白を削除 */
        width: calc(100% + 40px); /* 親要素のpadding分を加算 */
        margin-left: -20px; /* 左側のpaddingを相殺 */
        margin-right: -20px; /* 右側のpaddingを相殺 */
        box-sizing: border-box; /* 幅計算を内包する */
    }

    #search_inbox_train .reset_btn ul {
        padding: 10px 0 20px; /* ulのpadding削除 */
        margin: 0; /* ulのmargin削除 */
        list-style: none; /* デフォルトのリストスタイルを無効化 */
        display: inline-block;
    }

    #search_inbox_train .reset_btn ul li {
        margin: 0; /* liの余白削除 */
        padding: 0; /* liの内側余白削除 */
    }

    .search_result_list_box_top p.check_text {
        margin: 10px 0;
    }

    dd.search_result_list_box-station .reset_btn {
        border: none !important; /* 枠線を無効化 */
    }


    #map_canvas{
        width: 100%;
        height: 375px;
        clear: left;
        position: relative;
        overflow: hidden;
    }

    #map_details {
        clear: left;
        margin: 20px 0 0;
        padding: 0;
        width: 100%;
        /*height: 530px;
        border: solid 1px #ccc;*/
        height: auto;/*20250307*/
    }

    /* 詳細ページ */
    .detail_head_contents  {
        margin: 0 auto;
        width: 100%;
    }
    
    /* 基本データ */
    section.details_basic_data{
        margin-top: 50px;
    }

    section.recommendation {
        margin-top: 50px;
        width: 100%;
        padding: 0 0 15px 0;
    }

    section.surrounding_info {
        margin-top: 50px;
    }

    .detail_head_contents h1 {
        padding: 10px 20px;
        text-align: left;
        font-size: 18px;
        font-weight: 400;
        color: #ffffff;
    }


    h2.title_room_photo_map,
    h2.details_room_title {
        font-size: 16px;
    }

    #details_contents {
        width: auto;
        padding: 10px 20px;
        margin-bottom: 50px;
        border: none;
    }

    .image_eria {
        width: 100%;
        display: inline-block;
    }

    .main_image_madori_eria {
        width: 100% !important;
        padding: 20px 0;
        margin: 0;
    }

    .main_image_eria {
        width: 100% !important;
        padding: 20px 0;
        margin: 0;
    }


    .details_info_text_box_01 {
        display: inline-block;
        margin: 0px;
        width: 100%;
    }

    .details_info_text_inbox_01 {
        padding: 15px 15px;
        width: 81vw;
    }


    .details_info_text_inbox_01 h2 {
        font-size: 16px !important;
    }

    
    .details_info_text_inbox_01 ul {
        width: auto;
    }

    .details_info_text_inbox_contact{
        display: none;
    }

    #detailMap {
        width: 100%!important;
        height: 350px!important;
        margin-bottom: 20px;
    }


    .mapicon_eria ul li {
        display: inline-block;
        width: 60px;
        height: 60px;
        margin-right: 0px!important;
        margin-bottom: 7px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
    }

    .mapicon_eria li a img {
        text-align: center;
        padding-bottom: 5px;
        width: 60%;
    }

    section.room_features {
        margin-top: 50px;
        padding: 0 20px;
    }

    section.detail_contact{
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 99999;
        width: 100%;
        margin: 0;
        padding: 10px;
    }

    .detail_mail_btn img {
        margin-right: 0px;
        width: 24px;
        height: 24px;
    }

    section.article_text {
        margin-top: 50px;
        padding: 0 20px;
    }


    section.other_rooms {
        margin-top: 50px;
        padding: 0 20px;
    }

    section.building_other_rooms {
        margin-top: 50px;
        padding: 0 0px;
    }

    section.recommended_properties {
        margin-top: 50px;
        padding: 0 20px;
    }


    h2.other_rooms_title {
        width: 96% !important;
        padding: 5px 5px 5px 10px;
        font-size: 16px;
        font-weight: normal;
        display: flex    ;
        align-items: center;
        margin: 0px;
        background: #eee;
    }

    .prejudice_housing{
        display: block;
        padding: 8px;
        gap: 15px;
    }

    .prejudice_housing_one {
        width: 100%;
        height: 150px;
        padding: 5px;
        margin-right: 5px;
        border-top: none;
        border-left: none;
        border-right: none;
    }

    /* SP版地図上 */
    .gm-style .gm-style-iw-c{
        max-width: 260px!important;
    }



    #map_canvas .prejudice_housing_one {
        width: 100%;
        height: 150px;
        padding: 0px;
        margin-right: 0px;
        border-top: none;
        border-left: none;
        border-right: none;
    }

    .prejudice_housing_one h4 {
        display: inline-block;
    }

    #map_canvas .map-search .prejudice_housing_img {
        display: block;
        padding: 10px 0px!important;
    }
    

    #map_canvas .prejudice_housing_text{
        float: right;
        margin-top: 0;
    }

    #map_canvas .prejudice_housing_text dl.prejudice_housing_text_dl{
        font-size: 13px;
    }
    #map_canvas .prejudice_housing_text dl.prejudice_housing_text_dl dt{
        display: none;
    }
    /* 地図上 ここまで */

    .prejudice_housing_text dl {
        height: 15px;
        width: 100%;
        font-size: 14px;
    }
    .prejudice_housing_img {
        display: block;
        padding: 20px;
        text-align: center;
    }
    

    /* スマホのテーブル */
    .table_details {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
        margin-top: 0;
    }

    .table_details tr {
        display: flex;
        flex-wrap: wrap;
        margin: 0;
        padding: 0;
        border-bottom: 1px solid #dee2e6;
    }

    .table_details th {
        display: inline-block;
        width: 35%;
        padding: 10px;
        text-align: left;
        box-sizing: border-box;
        font-size: 14px;
        font-weight: normal;
        border-top: none;
    }

    .table_details td {
        display: inline-block;
        width: 65%;
        padding: 10px;
        text-align: left;
        box-sizing: border-box;
        font-size: 14px;
        font-weight: normal;
        border-top: none;
    }

    .table_details th:last-of-type,
    .table_details td:last-of-type {
        border-bottom: none;
    }

    /* 通常行（住所～徒歩時間）の背景色交互 */
    .table_details tr:nth-of-type(odd) {
        background-color: #ffffff;
        border-bottom: none;
    }

    .table_details tr:nth-of-type(even) {
        background-color: #f3f9f9;
        border-bottom: none;
    }

    /* モバイル行の背景色交互 */
    .table_details .mobile-row th:nth-of-type(odd),
    .table_details .mobile-row td:nth-of-type(odd) {
        background-color: #ffffff;
    }

    .table_details .mobile-row th:nth-of-type(even),
    .table_details .mobile-row td:nth-of-type(even) {
        background-color: #f3f9f9;
    }

    /* 賃料の強調 */
    .table_details .big {
        color: #a50600;
        font-weight: bold;
        font-size: 20px;
    }

    /* 備考行の特別スタイル 
    .table_details tr:last-child td {
        color: red;
        font-weight: bold;
        font-size: 20px;
    }
*/

    /* もう一つのテーブル */
    .dl_table {
        width: 99%;
        font-size: 14px;
        line-height: 1.6;
        border-collapse: collapse;
        margin-top: 0px;
        font-weight: normal;
    }

    .dl_table .row {
        display: block; /* 各行を縦方向に展開 */
        width: 100%;
        padding: 0; /* 行全体の余白をリセット */
    }

    .dl_table .column {
        display: block; /* 各カラムを縦方向に表示 */
        width: 100%; /* 全幅表示 */
        padding: 0; /* 上下左右に余白を追加 */
        box-sizing: border-box;
    }

    .dl_table dl {
        display: flex; /* dl内のdtとddを横並びに */
        justify-content: space-between; /* 左右のスペースを調整 */
        margin: 0;
    }

    .dl_table dt {
        flex: 0 0 40%; /* 固定幅を設定 */
        font-weight: normal;
        color: #009AAE;
    }

    .dl_table dd {
        flex: 1 1 60%; /* 残りのスペースを使用 */
        color: #333;
        margin: 0;
    }

    .dl_table .big {
        font-size: 16px; /* 強調表示用 */
        font-weight: bold;
        color: #cc0000; /* 赤色 */
    }

    /* 奇数カラムに背景色を設定 */
    .dl_table .column:nth-child(odd) {
        background-color: #ffffff; /* 白色 */
    }

    /* 偶数カラムに背景色を設定 */
    .dl_table .column:nth-child(even) {
        background-color: #F7FBFC; /* 薄い水色 */
        border-top: 1px solid #ddd;
    }

    /* 奇数カラムに背景色を設定 */
    .dl_table .column:nth-child(odd) {
        background-color: #ffffff; /* 白色 */
    }

    /* 偶数カラムに背景色を設定 */
    .dl_table-glay .column:nth-child(even) {
        background-color: #f9f9f9; /* 薄い水色 */
        border-top: 1px solid #ddd;
    }

    .details_room_point{
        /*display: none!important;*/
    }

    ul.details_room_point {
        width: auto;
        display: inline-block;
        margin-top: 20px;
    }

    ul.details_room_point li {
        border: none !important;
        float: left;
        text-align: center;
        padding: 5px 0;
        -webkit-border-radius: 0px;
        border-radius: 0px;
        color: #FFF;
        font-size: 13px !important;
        font-weight: normal !important;
        display: block;
        width: 31.5%;
        margin-right: 7px;
        margin-bottom: 7px;
    }


        /* 3個目ごとにmargin-rightを0にする */
        ul.details_room_point li:nth-child(3n) {
            margin-right: 0;
        }







    p.right{
        text-align: right;
    }

    .detail_contact_inbox {
        display: flex; /* フレックスボックスで横並び */
        justify-content: start; /* 子要素を左右中央揃え */
        align-items: center; /* 縦方向の中央揃え */
        gap: 20px 15px; /* ボタン間のスペース */
        flex-wrap: wrap; /* 必要に応じて折り返し */
    }

    .bottom-space{
        height: 80px;
    }

    .mapicon_eria {
        display: inline-block;
        clear: left;
        width: 100%;
        /* height: 500px; */
    }

    /* 建物詳細テーブル */
    .table_details_room{
        display: inline-block;
        font-size: 13px;
    }

    .table_details_room th {
        padding: 10px;
    }


    .table_details_room td {
        padding: 10px;
    }


    img.search_check{
        width: 18px;
        height: 18px;
    }

    .details_info_text_inbox_02 {
        padding: 10px;
        width: 90%;
    }

    /* SPもっと見る */
    .listlist .triangle:after {
        right: 50px;
    }

    #map_search_box p{
        display: inline-block;
        padding-top: 0px;
        font-size: 18px;
        font-weight: normal;
        margin-bottom: 30px;
        margin-top: 20px;
    }

    #map_search_box p img{
        vertical-align: middle;
    }

    .detail_contact_inbox button {
        display: none;
    }

    .prejudice_housing_one h4 {
        font-size: 16px;
        font-weight: bold;
    }
    
    .prejudice_housing_text{
        margin-top: 15px;
    }
    
    /* 地図から探すページ */
    #map_details .prejudice_housing_one {
        width: 95%;
        padding: 15px 10px 15px;
    }

    #map_details .prejudice_housing_img {
        float: left;
        display: block;
        padding: 10px 20px 0 0;
        width: auto;
        height: auto;
    }
    
    #map_details .prejudice_housing_img img {
        width: 90px;
        height: auto;
    }

    #map_details .prejudice_housing_text {
        font-size: 16px;
        float: left;
        clear: none;
        padding: 0px;
        margin-top: 0;
        width: 63%;
    }
    
    #map_details .prejudice_housing_list {
        gap: 5px; /* 各項目の間隔 */
    }

    
    .map-search .prejudice_housing_img {
        display: block;
        padding: 10px 10px;
    }

    #map_details dl.prejudice_housing_text_dl {
        height: 20px !important;
        width: 165px !important;
        border: none !important;
    }

    #map_details .prejudice_housing_text dd {
        float: left;
        width: 90px;
        height: 20px;
    }

    /*特徴設備20250205*/
    h3.details_room_title_sub {
        font-size: 16px;
        width: 91%;
    }

    #map_canvas .map-search .prejudice_housing_img {
        display: block;
        padding: 10px 0px!important;
    }


}

/* Lightboxの閉じるボタン */
.lightbox-close {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 30px;
    color: white;
    cursor: pointer;
    font-weight: bold;
    background: rgba(0, 0, 0, 0.5);
    padding: 10px 15px;
    border-radius: 5px;
    transition: background 0.3s ease;
    z-index: 1001; /* Lightboxより上に表示 */
}

.lightbox-close:hover {
    background: rgba(0, 0, 0, 0.8);
}

/* メイン見出しエリア */
#main-head {
    width: 100%;
    position: relative;
    padding-bottom: 10px; /* アンダーラインの余白 */
}

/* PC版の見出し */
.lower-head_contents {
    width: 1080px;
    margin: 0 auto 30px;
    position: relative;
    display: flex;
    align-items: flex-end; /* 見出しとアンダーラインを揃える */
}

/* h1のスタイル */
.lower-head_contents h1 {
    font-size: 24px;
    text-align: left;
    position: relative;
    display: inline-block;
    padding-bottom: 10px; /* アンダーラインとの間隔調整 */
    padding-top: 30px;
}

/* h1のアンダーライン */
.lower-head_contents::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%; /* 全幅にする */
    height: 3px;
    background-color: #2f74b5;
}

/* イラストの配置 */
.lower-head_contents::before {
    content: "";
    position: absolute;
    bottom: 2px; /* アンダーラインの上に配置 */
    right: 0;
    width: 179px; /* イラストの幅（適宜調整） */
    height: 68px; /* イラストの高さ（適宜調整） */
    background: url(../img/renewal2024/midashi_ill.svg) no-repeat center;
    background-size: contain;
}

/* SP版（幅768px以下）のデザイン調整 */
@media (max-width: 768px) {
    .lower-head_contents {
        width: 90vw;
        text-align: center;
        display: block;
        margin: 0 20px 0;

    }

    .lower-head_contents h1,
    .lower-head_contents h2 {
        text-align: left; 
        display: block;
        padding: 0 0 10px; /* アンダーラインとの間隔調整 */
        font-size: 20px;
    }

    .lower-head_contents::after {

    }

    .lower-head_contents::before {
        content: "";
        position: absolute;
        bottom: 2px; /* アンダーラインの上に配置 */
        right: 0;
        width: 108px; /* イラストの幅（適宜調整） */
        height: 41px; /* イラストの高さ（適宜調整） */
        background: url(../img/renewal2024/midashi_ill.svg) no-repeat center;
        background-size: contain;
        }
}


/* 営業所一覧 */

/* ===== タブボタンのデザイン ===== */
.office-tabs {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 20px;
}

/* タブボタン */
.office-tab-btn {
    background: #43B0C5;
    color: white;
    border: none;
    padding: 10px 10px 25px;
    font-size: 24px;
    border-radius: 8px;
    cursor: pointer;
    text-align: center;
    width: 200px;
    height: 85px;
    font-weight: normal;
    position: relative;
    transition: 0.3s ease-in-out;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* タブボタン内の英語表記 */
.office-tab-btn span {
    display: block;
    font-size: 14px;
}

/* タブボタンの下に「>」のような形を追加 */
.office-tab-btn::after {
    content: "";
    position: absolute;
    bottom: 6px; /* ボタンのすぐ下に配置 */
    left: 50%;
    width: 40px;  /* 横幅 */
    height: 15px;  /* 高さ */
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 15"><path d="M2 3 L15 12 L28 3" stroke="white" stroke-width="1" fill="none" /></svg>') no-repeat center;
    background-size: contain;
    transform: translateX(-50%);
}

/* アクティブ（選択状態）のボタン */
.office-tab-btn.active {
    background: #959595;
    color: white;
    box-shadow: none;
}



/* ===== 営業所情報のレイアウト ===== */
.office-container {
    width: 100%;
    max-width: 1080px; /* 余白を調整 */
    background: #f7f7f7;
    margin: auto;
    margin-top: 30px;
    margin-bottom: 50px;
    height: 500px;
    overflow-y: scroll;
    overflow-x: hidden;
}

/* タブ切り替えで非表示 */
.office {
    display: none;
}

.office.active {
    display: block;
}

/* 見出しデザイン */
.office h2 {
    background: #579BDE;
    color: #fff;
    padding: 5px 0px;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    margin-top: 0;
}

/* 営業所の詳細レイアウト */
.office-content {
    display: flex;
    gap: 30px; /* 余白を調整 */
    flex-wrap: wrap;
    padding: 50px 90px;
    align-items: flex-start;
    height: 350px;
}

/* 地図エリア */
.map {
    flex: 1;
    min-width: 350px;
    margin-right: 20px;
}

.map iframe {
    width: 100%;
    height: 270px; 
    border: none;
}

a.map-btn {
    display: inline-block;
    background: #2eb4d5;
    color: white;
    text-align: center;
    padding: 5px 10px;
    margin-top: 10px;
    text-decoration: none;
    border-radius: 5px;
    font-size: 18px;
    transition: background-color 0.3s ease, opacity 0.3s ease; /* アニメーションの設定 */
}

a.map-btn:hover {
    background: rgba(46, 180, 213, 0.7); /* 色を薄くする */
}

/* 住所・電話番号エリア */
.office-info {
    flex: 2;
    font-size: 24px;
}

/* 住所 */
.office-info p {
    font-size: 20px;
    line-height: 1.6;
    font-weight: 300;
}

.office-info p span {
    font-size: 18px;
    line-height: 1.6;
    font-weight: 300;
    margin-top: 4px; /* 住所の間隔調整 */
}

/* TEL & FAXのスタイル */
.office-info strong {
    display: inline-block;
    width: 60px;
    font-size: 20px;
    position: relative;
    font-weight: 300;
}

/* 下線の色だけを変更 
.office-info strong::after {
    content: "";
    display: block;
    width: 40px;
    height: 2px;
    background-color: #43B0C5;
    position: absolute;
    bottom: 5px;
    left: 0;
}
*/

.office-info .tel-top{
    margin-top: 1em;
}

.office-info .tel,
.office-info .fax {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 20px;
}

.office-info a {
    color: inherit; /* 文字色を既存のテキストに合わせる */
    text-decoration: none; /* 下線をなくす */
}

.office-info a:hover {
    color: #43B0C5; /* ホバー時に少し目立たせる */
}


.office-info .left-space{
    padding-left: 72px;
}

.map-btn-sp {
    display: none;
}

.office-info p span.no-link {
    font-size: 20px;
    pointer-events: none;
    user-select: text;
    color: inherit;
    text-decoration: none;
}


/* レスポンシブ調整 */
@media (max-width: 768px) {
    .office-container {
        padding: 0;
        width: 100%;
        background:#fff;
        height: 440px;
    
    }

    /* ===== タブボタンのデザイン ===== */
    .office-tabs {
        padding: 0 20px;
        gap: 10px;
    }

    /* タブボタン */
    .office-tab-btn {
        width: 20vw;
        height: 50px;
        font-size: 14px;
        border-radius: 0;
        padding: 10px 5px 10px;
    }

    /* タブボタン内の英語表記 */
    .office-tab-btn span {
        font-size: 10px;
    } 

    /* タブボタンの下に「>」のような形を追加 */
    .office-tab-btn::after {
        bottom: 0px; /* ボタンのすぐ下に配置 */
        display: none;
    }

    .office-content {
        flex-direction: column;
        gap: 20px;
        padding: 0px 20px 20px;
        height: auto;
    }
    
   /* 地図を非表示 */
   .map {
    display: none;
    }

    /* 住所とボタンを一緒にする */
    .office-info {
        font-size: 15px;
        display: flex;
        flex-direction: column;
    }

    /* ボタンの順番を変更（住所の直後に配置） */
    .map-btn-sp {
        display: block;
        background: #43b0c5;
        color: white;
        text-align: center;
        width: 120px;
        padding: 5px 10px 5px 20px;
        font-size: 15px;
        margin: 15px 0; /* 住所との余白を調整 */
        text-decoration: none;
        border-radius: 5px;
    }
    .map-btn-sp {
        display: inline-flex;
        align-items: center;
        gap: 6px; /* テキストとアイコンの間隔 */
        text-decoration: none;
    }
      
    a.map-btn-sp {
        color: white;
    }
    .map-icon {
        width: 2em;
        height: 2em;
    }

    /* 見出し */
    .office h2 {
        text-align: left;
        font-size: 20px;
        padding: 5px 20px;
    }

    /* 住所 */
    .office-info p {
        font-size: 18px;
        line-height: 1.7;
        font-weight: 300;
    }

    /* TEL & FAXのスタイル */
    .office-info strong {
        display: inline-block;
        width: 60px;
        font-size: 20px;
        position: relative;
        font-weight: 300;
    }

    .office-info .tel,
    .office-info .fax {
        display: flex;
        align-items: baseline;
        gap: 12px;
        font-size: 20px;
    }

    .office-info .tel a {
        color: inherit;
        text-decoration: none;
        transition: color 0.3s;
    }
    
    .office-info .tel a:active {
        color: #43B0C5;
    }
        
    .office-info .left-space{
        padding-left: 72px;
    }

    .office-info .tel span {
        font-size: 14px;
        line-height: 1.7;
        font-weight: 300;
        margin-bottom: 5px; /* 住所の間隔調整 */
        text-decoration: none!important;
    }

    .office-info .tel-top{
        margin-top: 0.5em;
    }
}



/* 入居者保証制度 */

p.tabbutton{
    display: flex;
}


.button-a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #2589d0;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    text-decoration: none;
}

.button-a:hover {
    background-color: #1579c0;
}

.button-b {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #F58220;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
}

.button-c {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #F58220;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    text-decoration: none;
}

.button-c:hover {
    background-color: #F5B720;
}

.button-d {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    background-color: #2589d0;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
}


/* ===== 木下の賃貸のお得なサービス choice_new.inc ===== */
.choice-new {
    background: #fdf9ef;
    padding: 60px 0;
  }
  
  .choice-inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 20px;
  }
  
  .choice-title {
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    line-height: 1.8;
    margin-bottom: 50px;
    color: #5A5A5A;
  }
  
  .choice-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 30px;
  }
  
  .choice-block {
    position: relative;
    padding-top: 44px;
  }
  
  .choice-label {
    position: absolute;
    top: 0;
    left: 0;
    width: 224px;
    height: 230px;
    clip-path: polygon(0 0, calc(100% - 25px) 0, 100% 45px, 100% 100%, 0 100%);
    color: #fff;
    font-size: 18px;
    font-weight: 100;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 10px 10px;
    gap: 6px;
    z-index: 1;
  }
  
  .label-title {
    font-weight: bold;
    font-size: 18px;
  }
  
  @media screen and (min-width: 769px) {
    .label-title {
      display: none !important;
    }
  }
  
  .choice-label::before {
    content: "";
    width: 19px;
    height: 19px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    display: inline-block;
    margin-top: 5px;
    margin-left: 3px;
  }
  
  .choice-card {
    position: relative;
    z-index: 2;
    background: #fff;
    padding: 15px;
    display: flex;
    margin-left: 10px;
    margin-top: 0px;
    height: 160px;
  }
  
  .choice-image {
    flex: 0 0 219px;
    margin-right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .choice-image img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
  }
  
  .choice-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  
  .choice-content h3 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    position: relative;
    padding-left: 12px;
    display: flex;
    align-items: center;
    width: auto;
  }
  
  .tag-member .choice-content h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 1.2em;
    background: #3aa89b;
  }
  
  .tag-point .choice-content h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 1.2em;
    background: #4e81c4;
  }
  
  .tag-support .choice-content h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 1.2em;
    background: #5b9ba4;
  }
  
  .choice-content p {
    font-size: 17px;
    line-height: 1.8;
    margin-bottom: 15px;
    margin-left: 10px;
  }
  
  .choice-link {
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
    align-self: flex-end;
    margin-top: auto;
    align-self: flex-end;
  }
  
  .choice-link:hover {
    opacity: 0.8;
    text-decoration: none;
  }
  
  .tag-member .choice-label {
    background-color: #00AD99;
  }
  .tag-member .choice-link {
    color: #00AD99;
  }
  .tag-member .choice-label::before {
    background-image: url('/img/renewal2024/icon-member.svg');
  }
  
  .tag-point .choice-label {
    background-color: #579BDE;
  }
  .tag-point .choice-link {
    color: #579BDE;
  }
  .tag-point .choice-label::before {
    background-image: url('/img/renewal2024/icon-point.svg');
  }
  
  .tag-support .choice-label {
    background-color: #43B0C5;
  }
  .tag-support .choice-link {
    color: #43B0C5;
  }
  .tag-support .choice-label::before {
    background-image: url('/img/renewal2024/icon-support.svg');
  }
  
  @media screen and (max-width: 768px) {
    .choice-new {
      background: #fff;
      padding: 0 0 60px;
    }
  
    .choice-inner {
      max-width: 100%;
      margin: 0 auto;
      padding: 0;
    }
  
    .choice-title {
      font-size: 18px;
      text-align: left;
      padding: 0 20px;
    }
  
    .choice-block {
      padding-top: 0;
    }
  
    .choice-grid {
      grid-template-columns: 1fr;
      gap: 30px;
    }
  
    .choice-label {
      position: relative;
      background: none;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 4px 40px 4px 10px;
      height: 30px;
      width: 80%;
      color: #fff;
      clip-path: polygon(0 0, calc(100% - 25px) 0, 100% 70px, 100% 100%, 0 100%);
    }
  
    .choice-label::before {
      display: none;
    }
  
    .label-title {
      font-weight: 300;
      font-size: 16px;
      color: #fff;
    }
  
    .label-type {
      display: inline-flex;
      align-items: center;
      font-weight: 150;
      font-size: 14px;
      color: #fff;
      gap: 4px;
    }
  
    .label-type i {
      display: inline-block;
      width: 14px;
      height: 14px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      margin: 0;
    }
  
    .tag-member .label-type i {
      background-image: url('/img/renewal2024/icon-member.svg');
    }
  
    .tag-point .label-type i {
      background-image: url('/img/renewal2024/icon-point.svg');
    }
  
    .tag-support .label-type i {
      background-image: url('/img/renewal2024/icon-support.svg');
    }
  
    .choice-card {
      display: grid;
      grid-template-columns: 90px 1fr;
      align-items: flex-start;
      padding: 16px;
      margin-left: 0;
      height: auto;
      gap: 12px;
    }
  
    .choice-grid > .choice-block:nth-child(odd) .choice-card {
      background-color: #F5F5F5;
    }
  
    .choice-grid > .choice-block:nth-child(even) .choice-card {
      background-color: #E6E6E6;
    }
  
    .choice-image {
      width: 90px;
      padding-top: 0px;
    }
  
    .choice-image img {
      max-width: 100%;
      height: auto;
      display: block;
    }
  
    .choice-content {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .choice-content h3 {
      display: none;
    }
  
    .choice-content h3::before {
      display: none;
    }
  
    .choice-text-wrap {
        display: flex;
        justify-content: space-between;
        align-items: center; /* ← これで上下中央揃え */
        gap: 12px;
        min-height: 64px; /* ← 2行でも高さ安定させる */
      }
      
      .choice-text-wrap p {
        font-size: 14px;
        line-height: 1.6;
        margin: 0;
        flex: 1;
        display: flex;
        align-items: center; /* ← テキストも縦センター揃え */
      }

    .choice-link {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        background-color: #fff;
        border-radius: 50%;
        font-size: 0;
        text-indent: -9999px;
        flex-shrink: 0;
        position: relative;
        transform: translateY(-15px); /* ← ここがポイント！ */
      }
              
    .choice-link::after {
      content: ">";
      font-size: 18px;
      font-weight: bold;
      color: inherit;
      text-indent: 0;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
  
    /* ラベル・矢印の色 */
    .tag-member .choice-label {
      background-color: #00AD99;
    }
    .tag-member .choice-link::after {
      color: #00AD99;
    }
  
    .tag-point .choice-label {
      background-color: #579BDE;
    }
    .tag-point .choice-link::after {
      color: #579BDE;
    }
  
    .tag-support .choice-label {
      background-color: #43B0C5;
    }
    .tag-support .choice-link::after {
      color: #43B0C5;
    }
  }
  



/* ========== カーシェアバナーセクション ========== */
.carshare-section {
    background-color: #fff;
    padding: 0px 0px 60px;
  }
  
  .carshare-lead {
    font-size: 18px;
    color: #333;
    margin-bottom: 30px;
    font-weight: 350;
  }
  
  .carshare-banner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    background-color: #43B0C5;
    color: #fff;
    padding: 30px;
    gap: 20px;
  }
  
  .carshare-banner-left {
    flex: 1 1 60%;
  }
  
  /* ロゴ横並び */
  .banner-logo-wrap {
    display: flex;
    align-items: center;
    margin-bottom: 0px;
  }
  
  .banner-logo {
    height: 40px;
    width: auto;
  }
  
  .banner-x {
    margin: 0 12px;
    font-size: 24px;
    font-weight: bold;
  }
  
/* PC版：banner-main-rowの構造修正 */
.banner-main-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 0px;
  }
  
  /* 左側：テキスト群ラッパー */
  .banner-left-block {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
    max-width: 500px;
  }  
  
/* イラスト */
.banner-visual-wrap {
    flex-shrink: 0;
  }
  

  .banner-title-text {
    font-size: 32px;
    font-weight: bold;
    white-space: nowrap;
    letter-spacing: 0.5px;
    margin-top: 5px;
  }
  
  .banner-text-wrap {
    margin-top: 10px;
  }
  
/* 罫線とテキスト */
.banner-line {
    width: 100%;
    height: 2px;
    background-color: #fff;
    margin-bottom: 10px;
  }
    
.banner-text {
  font-size: 20px;
  line-height: 1.6;
  letter-spacing: 0.5px;
  text-align: left;
  max-width: 100%;
}

  /* === イラスト === */
  .banner-visual {
    height: 87px;
    width: auto;
  }
  
  /* 吹き出しなど右カラム */
  .carshare-banner-right {
    flex: 1 1 35%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 20px;
  }
  
  .banner-pill {
    background: #fff;
    color: #43B0C5;
    font-weight: 350;
    font-size: 20px;
    padding: 5px 15px;
    border-radius: 30px;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
  }
  
  .banner-box {
    position: relative;
    border: 1px solid #fff;
    border-radius: 12px;
    padding: 12px 20px;
    background-color: transparent;
    margin-top: 10px; /* 三角との距離を内包で吸収 */
    width: fit-content;
    width: 100%;
  }
  
    .banner-box p {
    font-size: 16px;
    line-height: 1.6;
    text-align: left;
    position: relative; /* ←追加 */
    z-index: 2;
    }

  .banner-box::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 45%;
    transform: translateY(-50%) rotate(45deg) skew(30deg, 30deg);
    width: 20px;
    height: 20px;
    background-color: #43B0C5;
    border-left: 1px solid #fff;
    border-top: 1px solid #fff;
    z-index: 1;
  }

  
  .banner-pill,
  .banner-box {
    max-width: 100%;
    width: fit-content;
    min-width: 280px;
  }
  
/* キャンペーン全体ボックス */
.campaign-box {
    display: flex;
    gap: 35px;
    margin: 100px 0 40px;
    flex-wrap: nowrap;  
}
  
  /* キャンペーンアイテム */
  .campaign-item {
    position: relative;
    background-color: #FFF2AF;
    padding: 30px 20px 20px 20px;
    border-radius: 4px;
    flex: 1 1 50%;
      box-sizing: border-box;
  }
  
  /* フラッグ（PC版） */
  .campaign-flag {
    position: absolute;
    top: -50px;
    left: 0;
    background-color: #FFBA00;
    color: #000;
    font-weight: bold;
    font-size: 24px;
    padding: 6px 30px 6px 16px;
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 100%, 0% 100%);
    z-index: 1;
  }
  
  /* 本文 */
  .campaign-text {
    font-size: 20px;
    line-height: 1.6;
  }
  
  .campaign-text span {
    font-size: 16px;
  }
  

/* --- ラッパー全体 --- */
.code-wrapper {
    position: relative;
    width: 100%;
    margin: 50px 0 50px;
  }
  
  .code-section {
    position: relative;
    background-color: #d2f7ff;
    padding: 30px 0 30px 40px; /* 上下に余裕をもたせる */
    display: flex;
    justify-content: flex-start;
    align-items: center;
    clip-path: polygon(0 0, 76% 0, 58% 100%, 0% 100%);
    overflow: visible;
    z-index: 1;
  }  

  .code-text-area {
    max-width: 600px;
    z-index: 2;
  }

  /* --- 上段：ラベルとコードボックス --- */
  .code-header {
    background-color: #43B0C5;
    display: flex;
    align-items: center;
    padding: 10px 16px;
    max-width: 450px;
    /*width: 100%;*/
    gap: 12px;
  }
  
  .code-label {
    color: #fff;
    font-weight: 500;
    font-size: 24px;
  }
  
  .code-value {
    background-color: #fff;
    padding: 0px 10px;
    display: flex;
    align-items: center;
    gap: 0px;
  }
  
  #code-text {
    font-weight: bold;
    font-size: 30px;
    padding-right: 10px;
  }

  .copy-btn {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
  }
  
  /* --- 説明文 --- */
  .code-description {
    margin: 16px 0 24px;
    font-size: 18px;
    line-height: 1.6;
  }
  
  .code-description .highlight {
    color: #FF4F4F;
    font-weight: bold;
  }
  
  /* --- ボタンエリア --- */
  .code-buttons {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 550px;
    width: 100%;
  }

  .code-buttons a {
    text-decoration: none;
  }

/* 入会するボタン */
.join-btn {
  background-color: #FF6565;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  padding: 14px 20px;
  border: none;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.arrow-circle {
  background-color: #fff;
  color: #FF6565;
  font-weight: bold;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 20px;
}

/* サイトリンクボタンは文字ぴったり */
.link-btn {
  background-color: #0F3961;
  color: #FFBA00;
  font-size: 18px;
  font-weight: bold;
  padding: 12px 16px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  text-decoration: none;
}

.join-btn,
.link-btn {
  transition: opacity 0.3s ease;
}

.join-btn:hover,
.link-btn:hover {
  opacity: 0.7;
}

.station-link-wrap {
    background-color: #f2f2f2;
    padding: 20px 20px;
    text-align: center;
  }
  
  .station-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #AAC7CC;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    padding: 10px 32px;
    text-decoration: none;
    transition: opacity 0.3s ease;
  }
  
  .station-link:hover {
    opacity: 0.8;
  }
  
  .station-link .station-arrow {
    background-color: #fff;
    color: #AAC7CC;
    font-size: 20px;
    font-weight: bold;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 16px;
  }
  

/* 車画像の重なりと位置調整 */
.code-photo {
    position: absolute;
    top: 30px;  
    right: 0;
    width: 50%;
    height: auto;
    object-fit: cover;
    z-index: 2;
  }


  @media screen and (max-width: 768px) {
    .carshare-banner {
      flex-direction: column;
      align-items: center;
      padding: 30px 20px;
    }
  
    .carshare-lead {
      padding: 0 20px;
    }
  
    .banner-logo-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 0px;
    }
  
    .carshare-banner-left {
        width: 100%;
        box-sizing: border-box;
    }

      
    .carshare-banner-right {
      align-items: center;
      width: 100%;
      box-sizing: border-box;
  }
  
    .banner-pill {
        text-align: center;
        font-size: 1rem;
        width: 100%;
    }
  
    .banner-box {
        text-align: left;
        padding: 14px 10px;
        font-size: 0.9rem;
        width: 95%;
      }


      .banner-main-row {
        display: contents; /* 子要素をバラして flow に従わせる */

    }


    .banner-header {
        order: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
      }
    
      .banner-text-wrap {
        order: 2;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin-top: 0;
      }
    
      .banner-visual-wrap {
        order: 3;
        width: 100%;
        text-align: center;
        margin-top: 0px;
      }  



    .banner-title-text {
      font-size: 28px;
      font-weight: 450;
      white-space: nowrap;
      letter-spacing: 0.5px;
      margin-top: 5px;
      margin-bottom: 10px;
      text-align: center;
    }
  
  
    .banner-line {
      width: 83vw;
      height: 2px;
      background-color: #fff;
      margin-bottom: 10px;
    }
  
    .banner-text {
      text-align: center;
      font-size: 18px;
      margin-bottom: 0px;
    }
  
  
    .banner-visual {
      height: 87px;
      width: auto;
      margin-top: 10px;
    }
  
    .campaign-box {
      flex-direction: column;
      margin: 0px 0 0px;
      gap: 0;
    }
  
    .campaign-item {
      flex: 1 1 100%;
      background-color: #FFF2AF;
      padding: 0px;
      border-radius: 6px;
      margin-bottom: 16px;
      margin-bottom: 0;
    }
  
    .campaign-flag {
      position: relative;
      top: 0;
      margin-bottom: 0px;
      background-color: #FFBA00;
      color: #000;
      font-size: 20px;
      font-weight: bold;
      padding: 10px 20px;
      border-radius: 0;
      width: auto;
      display: block;
      text-align: center;
      clip-path: none;
    }
  
    .campaign-text {
      font-size: 16px;
      line-height: 1.6;
      padding: 10px 20px;
    }
  
    .campaign-text span {
      font-size: 14px;
    }
  
    .code-wrapper {
      margin: 0px 0 0px;
      position: relative;
    }
  
    .code-section {
      background-color: #d2f7ff;
      padding: 30px 20px;
      clip-path: none;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
  
    .code-text-area {
      width: 100%;
    }
    #code-text {
        font-size: 24px;
        padding-right: 5px;
      }
    
    .code-header {
      background-color: #43B0C5;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 12px 16px;
      margin-bottom: 16px;
      width: 100%;
      box-sizing: border-box;
    }
  
    .code-label {
      color: #fff;
      font-weight: bold;
      font-size: 18px;
    }
  
    .code-value {
      background-color: #fff;
      padding: 0px 10px;
      display: flex;
      align-items: center;
      font-weight: bold;
      font-size: 20px;
      gap: 8px;
    }
  
    .code-description {
      font-size: 18px;
      line-height: 1.6;
      margin-bottom: 24px;
      text-align: left;
    }
  
    .code-buttons {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
    }
  
    .join-btn,
    .link-btn {
      display: inline-flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
      padding: 14px;
      border-radius: 4px;
      font-size: 18px;
      font-weight: bold;
      text-decoration: none;
      transition: opacity 0.3s ease;
    }
  
    .join-btn {
      background-color: #FF7070;
      color: #fff;
    }
  
    .link-btn {
      background-color: #003E65;
      color: #FFCA00;
      gap: 10px;
    }
  
    .join-btn:hover,
    .link-btn:hover {
      opacity: 0.7;
    }
  
    .code-photo {
      position: relative;
      width: 100%;
      height: auto;
      display: block;
      top: 0px;
      z-index: 0;
      padding: 0;
      margin: 0;
    }

    .code-photo img {
        display: block;
        width: 100%;
        height: auto;
      }

      .station-link-wrap {
        padding: 30px 20px;
      }

      
    .station-link {
        text-align: left;
        font-size: 1.2rem;
        padding: 10px 20px;
      }

      .station-link .station-arrow {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color: #fff;
        color: #999;
        font-size: 20px;
        line-height: 1; /* 行の高さの干渉をなくす */
        flex-shrink: 0;
          }
    
      
  }
  
/* ========== afineカード ========== */
.low-service-section {
  background-color: #fff;
  padding: 0px 0px 60px;
}

.low-service-lead {
  font-size: 18px;
  color: #333;
  margin-bottom: 30px;
  font-weight: 350;
}

.low-service-lead span {
  font-size: 16px;
}

.afine-banner {
  position: relative;
  border: 4px solid #221815;
  color: #333;
  padding: 20px;
  text-align: center;
  background-repeat: no-repeat;
  background-position: left 15% bottom 20px, right 15% bottom 20px;
  background-size: auto 50%, auto 50%;
  background-image: url("/img/renewal2024/bg_coin.png"), url("/img/renewal2024/bg_pig.png");
}

.sp-pig {
  display: none;
  margin-top: 20px;
  width: 100px;
  height: auto;
}

.banner-header {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
}

.banner-logo {
  height: 30px;
  object-fit: contain;
}

.banner-x {
  font-size: 24px;
  font-weight: bold;
}

.banner-title {
  font-size: 28px;
  font-weight: bold;
  margin-bottom: 20px;
  letter-spacing: 2px;
}

.banner-subtitle {
  background-color: #F26925;
  color: #fff;
  padding: 5px 100px;
  display: inline-block;
  border-radius: 25px;
  font-size: 18px;
  letter-spacing: 1px;
}

.afine-apply-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 30px;
  margin-top: 50px;
  border: 2px solid #231815;
  color: #231815;
  font-size: 20px;
  font-weight: bold;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

.afine-apply-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid #231815;
  border-radius: 50%;
  font-size: 16px;
  font-weight: bold;
  color: #231815;
}

.afine-apply-button:hover {
    background: #EA5504;
    border: 2px solid #EA5504;
    color: #fff;
}

.afine-apply-button:hover .afine-apply-arrow {
    border: 1px solid #fff;
    color: #fff;
}
.afine-feature {
  margin: 80px auto;
  padding: 0 0px;
}

.afine-feature-list {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.afine-feature-item {
  width: 100%;
}


@media (max-width: 767px) {
.afine-lead{
    padding: 0 20px;
    }
  .afine-banner {
    padding: 20px 15px;
    background-image: none;
    background-color: #fff;
    border: 4px solid #221815;
    text-align: center;
  }

  .banner-header {
    flex-direction: column;
    gap: 5px;
  }

  .banner-logo {
    height: 24px;
    object-fit: contain;
  }

  .banner-x {
    font-size: 20px;
    font-weight: bold;
    margin: 4px 0;
  }

  .banner-title {
    font-size: 26px;
    font-weight: bold;
    margin: 16px 0 8px;
    letter-spacing: 1px;
  }

  .banner-subtitle {
    font-size: 18px;
    background-color: #F26925;
    color: #fff;
    padding: 6px 0px;
    margin: 10px 0;
    border-radius: 25px;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
  }

  .sp-pig {
    display: block;
    margin: 20px auto 0;
    width: 80px;
    height: auto;
  }
}



/* ========== afineカード 1カラム＆2カラム特長紹介 ========== */

/* 共通 */
.afine-feature {
  margin: 80px auto;
  padding: 0;
}

h2.afine-feature-title {
  background-color: #231815;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  padding: 12px 30px 11px 20px;
  display: inline-block;
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 100%, 0% 100%);
  margin: 0;
}

.afine-feature-title-wrap {
    border-bottom: #231815 solid 2px;
}

.afine-feature-list {
  display: flex;
  gap: 40px;
  margin-top: 40px;
}

/* 1カラム */
.item-1col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.item-1col .afine-feature-icon-group {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
}

.item-1col .afine-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.item-1col .afine-icon img {
  width: 88px;
  height: 88px;
}

.item-1col .afine-feature-heading,
.item-1col .afine-feature-text {
  text-align: left;
  margin-left: 108px;
}

/* 2カラム共通 */

.afine-feature-row {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  justify-content: space-between;
}

.item-2col {
  flex: 1 1 calc(50% - 20px); /* gapの半分を引くのがポイント！ */
  display: flex;
  align-items: flex-start;
  gap: 16px;
  text-align: left;
  min-width: 0;
}

.afine-feature-col-icon {
  flex-shrink: 0;
}

.afine-feature-col-icon .afine-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.afine-feature-col-icon .afine-icon img {
  width: 88px;
  height: 88px;
  display: block;
}

.afine-feature-col-text {
  flex: 1;
  min-width: 0;
  text-align: left;
}

.afine-feature-heading {
  font-size: 22px;
  font-weight: 500;
  margin-bottom: 3px;
  width: 500px;
}

.afine-feature-text {
  font-size: 18px;
  line-height: 1.6;
  text-align: justify;
}

.afine-link {
  display: inline-flex;
  align-items: center;
  background-color: #AAC7CC;
  color: #fff;
  font-weight: 400;
  font-size: 18px;
  text-decoration: none;
  padding: 8px 12px;
  margin-top: 12px;
  transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

.afine-link img{
    padding-left: 10px;
}

.afine-link-icon {
  font-size: 12px;
  margin-left: 6px;
}

.afine-link:hover {
  background-color: #6B9EA7;
}

@media (max-width: 767px) {
  h2.afine-feature-title {
    font-size: 20px;
    background-color: #231815;
    color: #fff;
    padding: 20px 30px;
    border-radius: 0;
    display: block;
    width: 100%;
    clip-path: none;
    box-sizing: border-box;
  }

  .afine-feature-title-wrap {
    border: none;
    }


  .afine-feature-list {
    flex-direction: column;
  }

  .afine-feature-row {
    flex-direction: column;
  }


    .item-1col .afine-feature-icon-group {
    display: flex;
    align-items: center!important;
    justify-content: center;
    gap: 12px;
    margin: 20px auto;
  }

  .item-1col .afine-feature-heading,
  .item-1col .afine-feature-text {
    margin-left: 0px;
    text-align: justify;
    padding: 0px 20px;
  }

  .item-2col:first-of-type {
    background-color: #F5F5F5;
    padding: 40px 0px;
  }

  .item-2col {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  .item-2col .afine-feature-col-icon {
    display: flex;
    justify-content: center;
  }

  .item-2col .afine-feature-col-text {
    text-align: left;
    width: 100%;
  }

  /* 共通アイコンサイズ（1カラム・2カラム両方） */
  .afine-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center!important;
    justify-content: center;
    margin: 0 auto;
  }

  .afine-icon img {
    width: 64px!important;
    height: 64px!important;
  }

  h3.sp-text-center{
    text-align: center;
  }

  .afine-feature-heading {
    font-size: 20px;
    font-weight: 500;
    width: auto;
    margin-bottom: 20px;
    font-feature-settings: "palt";
    letter-spacing: 1px;
    padding: 0px 20px;
  }

  .afine-feature-text {
    font-size: 18px;
    line-height: 1.6;
    text-align: justify;
    font-feature-settings: "palt";
    letter-spacing: 1px;
    padding: 0px 20px;
  }

  .afine-link {
    justify-content: center;
    margin-left: 20px;
  }

  .afine-apply{
    padding: 0 20px;
  }

  .afine-apply-button {
    background-color: #F26925;
    color: #fff;
    border: none;
    padding: 20px;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
  }

  .afine-apply-arrow {
    background-color: #fff;
    color: #F26925;
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}


/* 特典キャンペーン */
.afine-campaign-box {
    display: flex;
    gap: 35px;
    margin: 150px 0 0px;
    flex-wrap: wrap;  
}
  
  /* キャンペーンアイテム */
  .afine-campaign-item {
    position: relative;
    border:2px solid #221815;
    flex: 1 1 33%;
    box-sizing: border-box;
    margin-bottom: 60px;
    height: 250px;
    width: calc(50% - 10px);
    padding: 30px 30px 60px;
}

  
  /* フラッグ（PC版） */
  .afine-campaign-flag {
    position: absolute;
    top: -65px;
    left: -2px;
    background-color: #221815;
    color: #fff;
    font-weight: 450;
    font-size: 22px;
    padding: 15px 30px 15px 30px;
    clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 100%, 0% 100%);
    z-index: 1;
    width: 82%;
  }
  
  /* 本文 */
  .campaign-text {
    font-size: 17px;
    line-height: 1.6;
    text-align: justify;
    font-weight: 450;
  }
  
  .campaign-text span {
    font-size: 14px;
  }

  .afine-campaign-box {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}


/* 青いボタン左下に固定 */
.afine-campaign-item .afine-link {
  position: absolute;
  bottom: 20px;
  left: 30px;
}

.afine-link img {
  width: 14px;
  height: auto;
  margin-left: 6px;
}

/* 2番目に背景画像1を指定 */
.afine-campaign-item:nth-child(1) {
  background-image: url("/img/renewal2024/bg_present.svg");
  background-repeat: no-repeat;
  background-position: right 30px bottom 20px;
  background-size: 62px auto;
}

/* 4番目に背景画像2を指定 */
.afine-campaign-item:nth-child(4) {
  background-image: url("/img/renewal2024/bg_touchless.svg");
  background-repeat: no-repeat;
  background-position: right 30px bottom 20px;
  background-size: 130px auto;
}

/* SP版 */
@media (max-width: 767px) {
  .afine-campaign {
    padding: 60px 0px 0;
  }

  .afine-campaign-box {
    flex-direction: column;
    gap: 40px;
    margin-top: 0;
  }

  .afine-campaign-item {
    width: 100%;
    padding: 0px;
    height: auto;
    border: none;
    margin-bottom: 0px;
  }

    /* 2番目に背景画像1を指定 */
    .afine-campaign-item:nth-child(1) {
    background-position: right 30px bottom 10px;
    background-size: 62px auto;
    }


/* 4番目に背景画像2を指定 */
    .afine-campaign-item:nth-child(4) {
    background-image: none;
    }

  .afine-campaign-flag {
    background-color: #231815;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    padding: 12px 0px;
    clip-path: none;
    width: 100%;
    margin-bottom: 5px;
    position: static;
  }

  .campaign-text {
    font-size: 18px;
    line-height: 1.8;
    color: #333;
    font-feature-settings: "palt";
  }

  .campaign-text span {
    font-size: 14px;
    margin-top: 8px;
    line-height: 1.2!important;
  }

  .afine-campaign-item .afine-link {
    position: static;
    margin-top: 16px;
  }
}


/* ========== ANAの住まい ========== */
/* ファーストビュー全体 */
/* 全体リードエリア */
.ana-lead {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto 40px;
  max-width: 1080px;
  padding: 0 0px;
}

/* バナー */
.ana-banner {
  width: 1080px;
  height: auto;
  background: url("/img/renewal2024/ana_fv_pc.png") no-repeat center top;
  background-size: 1080px auto;
  display: flex;
  align-items: center;
  padding: 30px 30px 30px 30px;
  box-sizing: border-box;
}

/* バナーの中身（左右分割） */
.ana-banner-inner {
  display: flex;
  width: 100%;
  padding: 0 0px;
  box-sizing: border-box;
  align-items: center;
  justify-content: space-between;
}

/* ロゴエリア */
.ana-banner-logo-area {
  width: 170px;
  flex-shrink: 0;
}

.ana-banner-logo-area img {
  width: 100%;
  height: auto;
  display: block;
}

/* テキストエリア */
.ana-banner-text-area {
  flex: 1;
  padding-left: 60px;
  color: #fff;
}

.ana-banner-subtitle {
  font-size: 27px;
  line-height: 1.5;
  letter-spacing: 1px;
  margin: 0;
}

.ana-banner-subtitle-line {
  display: inline-block;
  font-size: 27px;
  border-top: 1px solid #fff;
  padding-top: 10px;
  margin-top: 10px;
}






/* レスポンシブ対応（SP） */
@media screen and (max-width: 768px) {
    .ana-lead {
        padding: 0 0px;
        margin-top: 20px;
    }

  .ana-banner {
    background-image: url('/img/renewal2024/ana_fv_sp.png'); /* SP用背景画像 */
    width: 100%;
    height: auto;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 30px 0 120px;
  }

  .ana-banner-inner {
    max-width: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* ← 左揃えに変更 */
    gap: 16px;
    padding: 0 16px;
  }

  .ana-banner-logo-area {
    width: 40vw;
  }

  .ana-banner-logo-area img {
    width: 100%;
    height: auto;
    display: block;
  }

  .ana-banner-text-area {
    text-align: left; /* ← 左揃え */
    padding-left: 0px;
    padding-top: 0px;
    color: #fff;
  }

  .ana-banner-subtitle {
    font-size: 1.5em;
    line-height: 1.6;
    margin: 0;
  }

    .ana-banner-subtitle-line {
    font-size: 1.1em;
    }

  .low-service-lead {
    font-size: 16px;
    padding: 20px 20px;
    line-height: 1.8;
    text-align: justify;
  }

  
}



/* ANA Feature セクション */
/* タイトル */
.ana-feature-title {
  max-width: 1080px;
  margin: 60px auto 60px;
  padding-left: 10px;
  font-size: 24px;
  color: #000;
  border-left: 10px solid #003366;
  border-bottom: 2px solid #003366;
  line-height: 2;
}

/* セクション全体 */
.ana-feature {
  background-color: #D5F5FF;
  padding: 50px 0;
}

/* カラムレイアウト */
.ana-feature-row {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  gap: 40px;
  align-items: center;
  padding: 0 30px 0 50px;
  box-sizing: border-box;
}

.ana-feature-col-image {
  flex: 1;
  min-width: 0;
  box-sizing: border-box;
}

.ana-feature-col-image img {
  width: 100%;
  height: auto;
  display: block;
}

.ana-feature-col-text {
  flex: 1;
  padding: 0 20px;
  box-sizing: border-box;
}

.ana-feature-heading {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
  line-height: 1.5;
  font-feature-settings: "palt";
  letter-spacing: 0.5px;
}

h3.ana-feature-text,
.ana-feature-text {
  width: auto;
  font-size: 17px;
  line-height: 2;
  margin-bottom: 20px;
  font-weight: normal;
  text-align: justify;
}

p.ana-feature-btn-title{
    font-size: 18px;
    margin-bottom: 10px;
}

/* 緑ボタン */
.ana-feature-btn {
  display: inline-flex;
  align-items: center;
  background-color: #71C400;
  border: 3px solid #71C400;
  color: #fff;
  font-weight: 400;
  font-size: 18px;
  text-decoration: none;
  padding: 5px 50px;
  margin-top: 12px;
  transition: background-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

/* SVGアイコン共通クラス */
.ana-feature-btn-icon {
  width: 14px;
  height: auto;
  margin-left: 6px;
}

/* SVG内の塗り */
.ana-feature-btn .ana-feature-btn-icon path {
  fill: #fff;
  transition: fill 0.3s ease;
}

/* hover時に文字とSVG両方緑へ */
.ana-feature-btn:hover {
  background-color: #fff;
  color: #71C400;
  border: 3px solid #71C400;
}

.ana-feature-btn:hover .ana-feature-btn-icon path {
  fill: #71C400;
}





/* レスポンシブ */
@media (max-width: 768px) {

.ana-feature-title {
  margin: 30px 20px 30px;
  font-size: 18px;
}

/* セクション全体 */
.ana-feature {
  background-color: #D5F5FF;
  padding: 30px 0;
}


  .ana-feature-row {
    flex-direction: column;
    gap: 20px;
    padding: 0 20px 0 20px;
  }

    h3.ana-feature-text,
    .ana-feature-text {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 20px;
    }

  .ana-feature-row {
    flex-direction: column;
    gap: 20px;
  }

  .ana-feature-col-image,
  .ana-feature-col-text {
    width: 100%;
  }

  .ana-feature-col-text {
    padding: 0 0px;
  }

  .ana-feature-col-image img {
    max-width: 100%;
    height: auto;
  }
  p.ana-feature-btn-area{
    text-align: center;
}

}



/* --- ana-mile セクション全体 --- */
.ana-mile {
  padding: 20px 0 50px;
}

/* コンテンツラッパー */
.ana-mile-list {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 0px 0 0px;
  box-sizing: border-box;
}

/* 2カラムレイアウト（PC） */
.ana-mile-row {
  display: flex;
  gap: 60px;
  align-items: center;
  margin-bottom: 30px;
  flex-wrap: wrap;
}

/* 左カラム：画像 */
.ana-mile-col-image {
  flex: 1;
  min-width: 0;
  box-sizing: border-box;
}
.ana-mile-col-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* 右カラム：テキスト */
.ana-mile-col-text {
  flex: 1;
  padding: 0 0px;
  box-sizing: border-box;
}
h3.ana-mile-text {
width: auto;
    font-size: 17px;
    line-height: 2;
    margin-bottom: 0px;
    font-weight: normal;
    text-align: justify;
}

.ana-mile-text span {
    font-size: 19px;
  font-weight: bold;
}
.ana-mile-note {
  font-size: 17px;
  color: #00AD99;
  line-height: 1.8;
}

/* ボタンエリア（1カラム） */
.ana-mile-col-button {
  width: 100%;
  text-align: center;
  margin-top: 20px;
}
.ana-mile-btn {
  display: inline-block;
  background-color: #FFC400;
  border: 3px solid #FFC400;
  color: #fff;
  padding: 16px 40px;
  font-size: 20px;
  text-decoration: none;
  transition: 0.3s ease;
}
.ana-mile-btn:hover {
  background-color: #fff;
  color: #FFC400;
  border: 3px solid #FFC400;
}

.ana-mile-btn span {
  margin: 0 0.5em;
}

/* レスポンシブ対応（SP） */
@media screen and (max-width: 768px) {
  .ana-mile {
    padding: 0px 0 30px;
  }

  .ana-mile-list {
    padding: 0 20px;
  }

  .ana-mile-row {
    flex-direction: column;
    gap: 20px;
  }

  .ana-mile-col-image,
  .ana-mile-col-text {
    width: 100%;
    padding: 0;
  }

  .ana-mile-col-text {
    padding: 0;
  }

  h3.ana-mile-text {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 0px;
}

  h3.ana-mile-text span {
    font-size: 16px;
    font-weight: normal;
}

.ana-mile-note {
    font-size: 14px;
    line-height: 1.8;
    padding-bottom: 10px;
}


  .ana-mile-col-button {
    margin-top: 0;
  }

  .ana-mile-btn {
    width: 100%;
    padding: 16px 0px;
    font-size: 16px;
}
.ana-mile-btn span {
  margin: 0 0;
}

}


/* --- 共通ラップ --- */
.ana-step-wrap {
  position: relative;
  margin: 60px 0 60px 20px;
  padding: 0 0px 0 0px;
}

/* ▼ 縦線（全体通し） */
.ana-step-wrap::before {
  content: "";
  position: absolute;
  top: 60px;
  bottom: 60px;
  left: 40px;
  width: 4px;
  background-color: #003087;
  z-index: 0;
}

/* --- STEP項目 --- */
.ana-step-item {
  display: flex;
  gap: 20px;
  position: relative;
  padding: 20px 0;
  align-items: center;
  z-index: 1;
}

/* --- STEPアイコン --- */
.step-icon {
  position: relative;
  width: 80px;
  min-width: 80px;
  height: 120px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
}

.step-icon img {
  width: 80px;
  height: 80px;
  display: block;
  z-index: 3;
}

/* --- 白マスク除去 --- */
.step-icon::before,
.step-icon::after {
  display: none !important;
}

/* STEP1の上の縦線をカット */
.ana-step-item:first-child .step-icon::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 60px;
  background-color: #fff;
  transform: translateX(-50%);
  z-index: 2;
}

/* STEP6の下の縦線をカット */
.ana-step-item:last-child .step-icon::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 2px;
  height: 60px;
  background-color: #fff;
  transform: translateX(-50%);
  z-index: 2;
}

/* --- STEPボックス共通 --- */
.step-box {
  border: 4px solid #579BDE;
  padding: 20px 40px;
  flex: 1;
  position: relative;
  background-color: #F4F4F4;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ana-step-item h3.step-title {
  font-size: 22px;
  line-height: 1.6;
  margin: 0;
  color: #144293;
  width: 100%;
  font-weight: normal;
}

.ana-step-item p {
  font-size: 18px;
  line-height: 1.6;
  margin: 0;
  color: #000000;
  width: 100%;
}

/* --- ボタン位置 --- */
.step-btn {
  margin-left: 40px;
  flex-shrink: 0;
  text-align: right;
}

/* --- STEP3だけハイライト --- */
.ana-step-item.highlight .step-box {
  background-color: #D5F5FF;
  display: block;
  border: 8px solid #579BDE;
}

.ana-step-item.highlight .step-box p:first-of-type {
  font-size: 18px;
  line-height: 1.6;
  margin: 0;
  color: #000000;
  display: flex;
  align-items: center;
}

/* 重要ラベル */
.ana-step-item .tag {
  background-color: #A50600;
  color: #fff;
  font-size: 22px;
  padding: 0 15px;
  border-radius: 20px;
  display: inline-block;
  margin-right: 10px;
}

/* STEP3補足テキスト */
.ana-step-item.highlight .step-box p:nth-of-type(2) {
  font-size: 18px;
  line-height: 1.8;
  margin: 0 0 20px;
  color: #000;
}

/* --- STEP4は縦配置 --- */
.ana-step-item:nth-of-type(4) .step-box {
  flex-direction: column;
  align-items: flex-start;
}

/* 注釈 */
.ana-step-item .step-box p.note {
  font-size: 16px;
  line-height: 1.7;
  color: #000;
}

.ana-step-item .ana-feature-btn {
  margin-top: 0;
}

@media screen and (min-width: 768px) {
  .ana-step-item.highlight .step-title-row {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
  }

  .ana-step-item.highlight .step-tag-wrap {
    flex-shrink: 0;
  }

  .ana-step-item.highlight .step-title-row .step-title {
    margin: 0;
    font-size: 22px;
    line-height: 1.6;
  }

  .ana-step-item.highlight .step-title-row .br-sp {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .ana-step-wrap {
    padding: 40px 0;
    position: relative;
    margin: 0px 20px 20px 20px;
  }

  .ana-step-wrap::before {
    content: "";
    position: absolute;
    top: 40px;
    bottom: 60px;
    left: 50%;
    width: 4px;
    background-color: #003087;
    transform: translateX(-50%);
    z-index: 0;
  }

  .ana-step-list {
    position: relative;
    z-index: 1;
  }

  .ana-step-item {
    position: relative;
    background-color: #F4F4F4;
    padding: 20px 20px;
    margin: 0 0px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1;
    gap: 0;
  }

  /* --- STEP3だけハイライト（block化＋センター寄せ） --- */
  .ana-step-item.highlight {
    background-color: #D5F5FF;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .step-icon {
    width: 80px;
    height: 80px;
    position: relative;
    z-index: 2;
    margin: 0 auto 10px;
  }

  .step-icon::before,
  .step-icon::after {
    content: "";
    position: absolute;
    width: 4px;
    background-color: #003087;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0;
  }

  .ana-step-item:not(:first-child) .step-icon::before {
    top: -40px;
    height: 40px;
  }

  .ana-step-item:not(:last-child) .step-icon::after {
    bottom: -40px;
    height: 40px;
  }

  .step-icon img {
    width: 80px;
    height: 80px;
    display: block;
    margin: 0 auto;
    position: relative;
    z-index: 2;
  }

  .step-box {
    margin-top: 0px;
    padding: 0;
    border: none;
    background: none;
    width: 100%;
    display: block;
  }

  .step-box p {
    font-size: 18px;
    line-height: 1.7;
    color: #144293;
    text-align: center;
  }

  .ana-step-item h3.step-title {
    font-size: 18px;
    line-height: 1.6;
    margin: 0;
    color: #144293;
    width: 100%;
    font-weight: normal;
    text-align: center;
  }

  .ana-step-item p {
    font-size: 18px;
    line-height: 1.6;
    margin: 0;
    color: #000000;
    width: 100%;
  }

  .step-btn {
    margin-left: 0;
    margin-top: 20px;
    text-align: center;
  }

  .ana-step-item.highlight .step-box {
    background-color: #D5F5FF;
    padding: 0;
    border: none;
  }

  .ana-step-item.highlight .step-box p:first-of-type {
    font-size: 18px;
    text-align: left;
  }

  .ana-step-item.highlight .step-box p:nth-of-type(2) {
    font-size: 16px;
    text-align: left;
  }

  .ana-step-item .tag {
    text-align: center;
    font-size: 14px;
    padding: 2px 10px;
    display: inline-block;
  }

  .ana-step-item .step-box p.note {
    font-size: 16px;
    color: #000;
    margin-top: 15px;
    text-align: left;
  }

  .ana-step-item .step-box p.note span {
    display: none;
  }

  /* ▼ 追加：highlight（STEP3）のみ「重要」を中央に配置 */
  .ana-step-item.highlight .step-tag-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 10px;
  }

  .ana-step-item.highlight .tag {
    margin: 0 auto;
  }
}



/* 注意ブロック全体 */
.ana-statement {
  background-color: #F6F6F6;
  padding: 30px;
}

/* 注意ラベル（黄色の囲み） */
.ana-statement-label {
  display: inline-block;
  background-color: #FFF9D9;
  color: #000;
  border: 2px solid #000;
  border-radius: 24px;
  padding: 0px 16px;
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 10px;
}

/* リスト調整 */
.ana-statement ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ana-statement li {
  font-size: 17px;
  line-height: 1.8;
  margin-bottom: 5px;
}

@media screen and (max-width: 767px) {
  /* 注意ブロック全体 */
  .ana-statement {
    padding: 20px 20px;
  }

  /* 注意ラベル（中央寄せ） */
  .ana-statement-label {
    display: block;
    margin: 0 auto 12px;
    font-size: 18px;
    padding: 4px 16px;
    text-align: center;
    width: 50px;
  }

  /* リスト調整 */
  .ana-statement ul {
    padding-left: 0;
    list-style: none;
    margin: 0;
  }

  .ana-statement li {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 6px;
    padding-left: 1.2em;
    text-indent: -1.2em;
    position: relative;
  }
}


/* こんな場合 */
.ana-case {
  padding: 50px 0;
}

/* ヘッダー（アイコン＋タイトル） */
.ana-case-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
padding-left: 30px;
  padding-bottom: 10px;
  border-bottom: 2px solid #9A100C;
}

/* 赤い！マーク */
.ana-case-icon {
  background-color: #A50600;
  color: #fff;
  border-radius: 50%;
  font-weight: bold;
  font-size: 50px;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* タイトル */
.ana-case-title {
  font-size: 24px;
  font-weight: normal;
  margin: 0;
}

/* リスト */
.ana-case ul {
  margin: 0;
  padding: 0 0 0 30px;
  list-style: none;
}

.ana-case li {
  font-size: 17px;
  line-height: 1.8;
  margin-bottom: 5px;
}

.ana-case li span {
  }

@media screen and (max-width: 767px) {
  .ana-case {
    padding: 40px 16px;
  }

  .ana-case-header {
    flex-direction: row;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-left: 0;
    padding-bottom: 10px;
    border-bottom: 2px solid #9A100C;
  }

  .ana-case-icon {
    font-size: 50px;
    width: 50px;
    height: 50px;
  }

  .ana-case-title {
    font-size: 22px;
    line-height: 1.6;
    margin: 0;
  }

  .ana-case ul {
    padding-left: 0px;
    list-style: none;
    margin: 0;
  }

  .ana-case li {
    font-size: 16px;
    margin-bottom: 8px;
    line-height: 1.7;
    padding-left: 1.2em;
    text-indent: -1.2em;
    position: relative;
  }

  .ana-case li span {
    display: inline-block;
    font-size: 11px;
    line-height: 1.3!important;
    padding-left: 0em;
    text-indent: 0em;
    margin-bottom: 0px!important;
  }

  .ana-case li span.span-pc {
    display: none;
  }



}

/* 共通スタイル */
.ana-conversion-btn {
  background-color: #0b3f94;
  padding: 30px;
  text-align: center;
  color: #fff;
}

.ana-conversion-title-wrap {
  position: relative;
  margin-bottom: 1.5em;
}

.ana-conversion-title {
  display: inline-block;
  width: auto;
  position: relative;
  padding: 0 20px;
  color: #fff;
  font-size: 24px;
  font-weight: normal;
  letter-spacing: 0.05em;
}

/* デコ線共通 */
.ana-title-deco-sp {
  position: absolute;
}

.ana-title-deco-sp svg {
  width: 100%;
  height: 100%;
  stroke: #fff;
  stroke-linecap: round;
}

/* ボタン */
.ana-mile-col-button {
  text-align: center;
}

.ana-mile-btn {
  background-color: #ffc107;
  color: #fff;
  font-weight: normal;
  text-decoration: none;
  padding: 0.8em 1.5em;
  display: inline-block;
  font-size: 20px;
}

/* SP用 */
@media screen and (max-width: 768px) {
  .ana-conversion-btn {
    padding: 30px 20px;
  }

  .ana-mile-btn {
    padding: 0.8em 0em;
    font-size: 16px;
  }

  .ana-title-deco-sp {
    width: 3.8em;
    height: 3em; /* ← 高さを短く */
  }

  .ana-title-deco-sp.left {
    left: -1.5em;
    top: 1.7em; /* ← 上に移動 */
    transform: rotate(-45deg);
  }

  .ana-title-deco-sp.right {
    right: -1.5em;
    top: 1.7em; /* ← 上に移動 */
    transform: rotate(45deg);
  }

  .ana-title-deco-sp svg {
    stroke-width: 1px!important;
  }

  .ana-conversion-title {
    font-size: 24px;
    line-height: 1.8;
    width: auto;
  }

}

/* PC用 */
@media screen and (min-width: 769px) {
  .ana-title-deco-sp {
    width: 1.2em;
    height: 1.2em;
  }

  .ana-title-deco-sp.left {
    left: -0.5em;
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
  }

  .ana-title-deco-sp.right {
    right: -0.1em;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
  }

  .ana-title-deco-sp svg {
    stroke-width: 3px!important;
  }

  .ana-conversion-title {
    font-size: 1.2rem;
    white-space: nowrap;
    width: auto;
  }
}