@charset "utf-8";



body.find_a_store {}

#contents {
    margin: 0 auto;
    padding:0;
}

@media only screen and (max-width:1000px){
}



/* how_to_find */

#how_to_find {
    background:#f5f5f5;
}
#how_to_find ul {
    width:100%;
    margin: 50px auto 0;
    padding: 80px 0;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
}
#how_to_find ul li {
    width:45%;
    max-width:500px;
    margin: 1%;
    border:solid 3px #ddd;
    border-radius: 10px;
    background:#fff;
    transition: .3s;
}
#how_to_find ul li:hover {
    border:solid 3px #252222;
}
#how_to_find ul li a {
    padding:300px 0 30px;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
    font-size: 1.5rem;
    font-weight: 900;
    color: #252222;
    text-align: center;
    text-decoration: none;
}
#how_to_find ul li:nth-of-type(1) a {
    background: url("../img/how_to_find_map-01.png") top center no-repeat;
    background-size: 200px auto;
    background-position: 50% 20%;
}
#how_to_find ul li:nth-of-type(2) a {
    background: url("../img/how_to_find_map-02.png") top center no-repeat;
    background-size: 200px auto;
    background-position: 50% 20%;
}

@media only screen and (max-width:1000px){
    
    #how_to_find ul {
        width:90%;
    }
    #how_to_find ul li a {
        padding:210px 0 15px;
        display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
        font-size: 1.2rem;
    }
    #how_to_find ul li:nth-of-type(1) a {
        background: url("../img/how_to_find_map-01.png") top center no-repeat;
        background-size: 150px auto;
        background-position: 50% 20%;
    }
    #how_to_find ul li:nth-of-type(2) a {
        background: url("../img/how_to_find_map-02.png") top center no-repeat;
        background-size: 150px auto;
        background-position: 50% 20%;
    }
}



/* 直営店 */

.shop_list {
    width:100%;
    padding: 80px 0;
    background: #fff;
    position: relative;
}
#shop_list {
    position:absolute; top:-80px; left:0;
}
.shop_list h4 {
    width:100%;
    font-size: 2rem;
    text-align:center;
}
.shop_list ul.D-shop {
    width:80%;
    margin: 30px auto 0;
    display:flex; flex-flow:row wrap; justify-content:flex-start; align-content:stretch; align-items:stretch;
}
.shop_list ul.D-shop li {
    width:30%;
    margin: 1%;
    transition: .3s;
}

@media only screen and (max-width:900px){
    
    .shop_list ul.D-shop {
        width:92%;
    }
    .shop_list ul.D-shop > li {
        width:100%;
    }
}



/* shoplistIcon */

ul.shoplistIcon {
    width:90%;
    max-width:600px;
    margin: 0 auto 30px;
    display:flex; flex-flow:row wrap; justify-content:space-between; align-content:stretch; align-items:stretch;
}
ul.shoplistIcon li {
    width:15%;
    margin: 0;
    padding:0;
    font-size: 0.85rem;
    text-align: center;
    letter-spacing: 0;
}
ul.shoplistIcon li div {
    border-radius: 10px;
}
ul.shoplistIcon li div img {
    max-width:100%;
}
ul.shoplistIcon li.icon01 div { background:#f14653;}
ul.shoplistIcon li.icon02 div { background:#f3984f;}
ul.shoplistIcon li.icon03 div { background:#64b4c2;}
ul.shoplistIcon li.icon04 div { background:#ea648a;}
ul.shoplistIcon li.icon05 div { background:#80bf89;}
ul.shoplistIcon li.icon06 div { background:#6498de;}
ul.shoplistIcon li.no div { background:#ddd;}

.shopData a > ul.shoplistIcon {
    width:90%;
    margin: 10px 0 0;
    display:flex; flex-flow:row wrap; justify-content:flex-start; align-content:stretch; align-items:stretch;
}
.shopData ul.shoplistIcon li {
    width:15%;
    margin: 0 3px 0 0;
}
.shopData ul.shoplistIcon li div {
    border-radius: 5px;
}

@media only screen and (max-width:900px){

    ul.shoplistIcon li {
        width:15% !important;
        margin: 0;
        font-size: 0.8rem;
        text-align: center;
        letter-spacing: 0;
        line-height: 1.4;
    }
    ul.shoplistIcon li div {
        margin: 0 0 5px;
        padding: 10px 0;
    }
    .shopData ul.shoplistIcon li div {
        padding: 0;
    }
}




/* shopData */

.shopData {
    width:100%;
    display:flex; flex-flow:row wrap; justify-content:space-between; align-content:center; align-items:center;
}
.shopData a {
    color: #252222;
    text-decoration: none;
    transition: .3s;
}
.shopData a.shopPage ,
.shopData a.map-d-shop {
    width:95%;
    padding: 10px 0 14px 5%;
    border-radius: 10px;
    background: #fff;
    position:relative;
}
.shopData a p {
    line-height: 1.4;
}

.shopData-D-shop {
    margin-top: 90px !important;
    position:relative;
}
.shopData-D-shop:after {
    content:"ダイハツショップ";
    width:100%;
    font-size:1rem;
    font-weight:700;
    position:absolute; top:-60px; left:0;
}
.shopData-D-shop:before {
    content:"※ダイハツ工業株式会社より認定されている販売店です。";
    width:100%;
    font-size:0.85rem;
    font-weight:400;
    letter-spacing: 0.05em;
    position:absolute; top:-35px; left:0;
}


.shopData a.shopPage::before   ,
.shopData a.shopPage::after    ,
.shopData a.map-d-shop::before ,
.shopData a.map-d-shop::after {
    content: "";
    position:absolute; top:0; bottom:0; right:0;
    margin:auto;
    vertical-align:middle;
}
.shopData a.shopPage::before   ,
.shopData a.map-d-shop::before {
    width: 12px;
    height:12px;
    right: 20px;
    border-top: 2px solid #252122;
    border-right: 2px solid #252122;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: .3s;
}
.shopData a.shopPage:hover::before ,
.shopData a.map-d-shop:hover::before {
    right:15px;
}


    /* 直営店一覧 */

    .shopData a.shopPage { border:solid 3px #ddd;}
    .shopData a.shopPage:hover { border:solid 3px #252222;}
    

    /* 地図から探す */

    .how_to_find_map .shopData {
        margin:10px 0 0;
    }

    ul#open01 .shopData a.shopPage { border:solid 3px #f9dfaa;}
    ul#open01 .shopData a.shopPage:hover { border:solid 3px #ddd;}

    ul#open02 .shopData a.shopPage { border:solid 3px #cee6f4;}
    ul#open02 .shopData a.shopPage:hover { border:solid 3px #ddd;}

    ul#open03 .shopData a.shopPage { border:solid 3px #d9efc7;}
    ul#open03 .shopData a.shopPage:hover { border:solid 3px #ddd;}

    ul#open04 .shopData a.shopPage { border:solid 3px #ffcccc;}
    ul#open04 .shopData a.shopPage:hover { border:solid 3px #ddd;}

    ul#open05 .shopData a.shopPage { border:solid 3px #e7d6f2;}
    ul#open05 .shopData a.shopPage:hover { border:solid 3px #ddd;}

    a.map-d-shop { border:solid 3px #ddd !important;}
    a.map-d-shop:hover { border:solid 3px #252222 !important;}


@media only screen and (min-width:641px){

    .shopData a.shopPage ,
    .shopData a.map-d-shop {
        width:100%;
    }
}

@media only screen and (max-width:640px){
    
    .shopData a.shopPage ,
    .shopData a.map-d-shop {
        width:75%;
        padding: 7px 0 12px 5%;
    }
    .shopData a b {
        font-size:1.15rem;
    }
    .shopData a p {
        font-size:0.98rem;
        letter-spacing: 0.02em;
    }

    .shopData a.sp {
        width:15%;
    }
    .shopData a.sp:hover {
        opacity:.5;
        cursor: pointer;
    }
    .shopData a.sp img {
        max-width:100%;
        border-radius: 15px;
    }
    .shopData-D-shop {
        margin-top: 120px !important;
    }
    .shopData-D-shop:after {
        top:-85px;
    }
    .shopData-D-shop:before {
        top:-45px;
        letter-spacing: 0;
    }
}





/* ダイハツショップ */

.d-shop_list {
    width:100%;
    padding: 80px 0;
    background: #f5f5f5;
    position: relative;
}
#d-shop_list {
    position:absolute; top:-80px; left:0;
}
.d-shop_list h4 {
    width:100%;
    font-size: 2rem;
    text-align:center;
}
.d-shop_list h4 span {
    width:100%;
    margin: 10px auto 0;
    display:block;
    font-size: 1rem;
    font-weight: 400;
    text-align: center;
}
.d-shop_list ul {
    width:80%;
    max-width:1000px;
    margin: 30px auto 0;
    display:flex; flex-flow:row wrap; justify-content:flex-start; align-content:stretch; align-items:stretch;
}
.d-shop_list ul li {
    width:36%;
    margin: 1%;
    padding: 30px 5%;
    transition: .3s;
    border-radius: 15px;
    background:#fff;
    position: relative;
}
.d-shop_list ul li:nth-of-type(1):after {
    content:"";
    width: 100px;
    height:100px;
    position:absolute; top:30px; right:30px;
    background: url("../img/d-shop-oomiya.jpg") top center no-repeat;
    background-size:contain;
}
.d-shop_list ul li:nth-of-type(2):after {
    content:"";
    width: 100px;
    height:100px;
    position:absolute; top:30px; right:30px;
    background: url("../img/d-shop-shirosato.jpg") top center no-repeat;
    background-size:contain;
}
.d-shop_list ul li:nth-of-type(3):after {
    content:"";
    width: 100px;
    height:100px;
    position:absolute; top:30px; right:30px;
    background: url("../img/d-shop-shimodate.jpg") top center no-repeat;
    background-size:contain;
}
.d-shop_list ul li:nth-of-type(4):after {
    content:"";
    width: 100px;
    height:100px;
    position:absolute; top:30px; right:30px;
    background: url("../img/d-shop-koga.jpg") top center no-repeat;
    background-size:contain;
}
.d-shop_list ul li:nth-of-type(5):after {
    content:"";
    width: 100px;
    height:100px;
    position:absolute; top:30px; right:30px;
    background: url("../img/d-shop-kogachuou.jpg") top center no-repeat;
    background-size:contain;
}
.d-shop_list ul li:nth-of-type(6):after {
    content:"";
    width: 100px;
    height:100px;
    position:absolute; top:30px; right:30px;
    background: url("../img/d-shop-kogahigashi.jpg") top center no-repeat;
    background-size:contain;
}
.d-shop_list ul li:nth-of-type(7):after {
    content:"";
    width: 100px;
    height:100px;
    position:absolute; top:30px; right:30px;
    background: url("../img/d-shop-sakai.jpg") top center no-repeat;
    background-size:contain;
}

.d-shop_list ul li > div {
    position: absolute; top:-80px; left:0;
}
.d-shop_list ul li b {
    width:100%;
    margin: 0 0 10px;
    display: block;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.5;
}
.d-shop_list ul li a[target="_blank"] {
    padding: 3px 0;
    display:block;
    font-size: 0.9rem;
    color: #fff;
    text-align: center;
    text-decoration: none;
    border-radius: 50px;
    background: #252222;
    transition: .3s;
}
.d-shop_list ul li a[target="_blank"]:hover {
    color: #252222;
    background: #ddd;
}
.d-shop_list ul li dl {
    width:100%;
    margin: 20px 0;
    display:flex; flex-flow:row wrap; justify-content:flex-start; align-content:flex-start; align-items:flex-start;
}
.d-shop_list ul li dl dt ,
.d-shop_list ul li dl dd {
    padding: 3px 0;
    border-top:solid 1px #ddd;
}
.d-shop_list ul li dl dt { width:25%; min-width:5em;}
.d-shop_list ul li dl dd { width:75%;}

@media only screen and (max-width:1000px){
    
    .shop_list {
        padding: 50px 0;
    }
    .shop_list h4 ,
    .d-shop_list h4 {
        font-size: 1.5rem;
    }
    .shop_list ul ,
    .d-shop_list ul {
        margin: 20px auto 0;
    }
    .shop_list ul li {
        width:100%;
        margin: 1% 0;
    }
    
    .d-shop_list ul li {
        width:90%;
        margin: 15px 0;
        padding: 30px 8%;
    }
    .d-shop_list ul li:nth-of-type(1):after ,
    .d-shop_list ul li:nth-of-type(2):after ,
    .d-shop_list ul li:nth-of-type(3):after ,
    .d-shop_list ul li:nth-of-type(4):after ,
    .d-shop_list ul li:nth-of-type(5):after ,
    .d-shop_list ul li:nth-of-type(6):after ,
    .d-shop_list ul li:nth-of-type(7):after {
        width: 130px;
        height:130px;
        top: 40px;
        right:40px;
    }
    .d-shop_list ul li b {
        font-size: 1.35rem;
    }
    .d-shop_list ul li p {
        margin: 0 0 15px;
        line-height: 1.5;
    }
    .d-shop_list ul li a.sp {
        width:10em;
        padding: 3px 0;
        font-size: 0.9rem;
        text-align: center;
        text-decoration: none;
        border-radius: 50px;
        background: #ddd;
        transition: .3s;
    }
    .d-shop_list ul li a.sp:hover {
        color: #fff;
        background: #252222;
    }
    .d-shop_list ul li dl dt { width:25%;}
    .d-shop_list ul li dl dd { width:70%;}
}




/* 地図から探す */

#how_to_find_map {
    width:100%;
    margin: 30px auto 0;
    padding: 50px 0;
    background: #f5f5f5;
}
#how_to_find_map h4 {
    width:100%;
    font-size: 2rem;
    text-align:center;
}
.how_to_find_map {
    width:80%;
    max-width:1000px;
    height: 830px;
    margin:20px auto;
    position: relative;
    background: url("../img/how_to_find_map-01.png") top left no-repeat;
    background-size: auto 600px;
}
.how_to_find_map label {
    display: block;
    width:100px;
    position:absolute;
    cursor: pointer;
}
.how_to_find_map label img {
    max-width:100%;
    margin: 0;
    opacity: 0.3;
    transition: .3s;
}
.how_to_find_map label:hover img {
    margin-top:-5px;
}
input[type="radio"]:checked + label img {
    opacity: 1;
}

.m01 {left:280px; top:100px;} /*県北*/
.m02 {left:245px; top:240px;} /*県央*/
.m03 {left:60px; top:280px;} /*県西*/
.m04 {left:170px; top:400px;} /*県南*/
.m05 {left:330px; top:360px;} /*鹿行*/

.how_to_find_map input {
    display: none;
}
.how_to_find_map ul {
    overflow-y: hidden;
    max-height: 0;
    transition: all 0.5s;
}

#m01:checked ~ #open01 li,
#m02:checked ~ #open02 li,
#m03:checked ~ #open03 li,
#m04:checked ~ #open04 li,
#m05:checked ~ #open05 li {
    width:45%;
    padding:0;
    opacity: 1;
    position:absolute; top:0; right:0;
}

@media only screen and (max-width:1000px){
    
    #how_to_find_map h4 {
        font-size: 1.5rem;
    }
    .how_to_find_map {
        height: 1480px;
        margin:20px auto;
        position: relative;
        background: url("../img/how_to_find_map-01.png") top left no-repeat;
        background-size: auto 600px;
    }
    #m01:checked ~ #open01 li,
    #m02:checked ~ #open02 li,
    #m03:checked ~ #open03 li,
    #m04:checked ~ #open04 li,
    #m05:checked ~ #open05 li {
        width:100%;
        position:absolute; top:620px; right:0;
    }
}



/* 現在地から探す */

#how_to_find_gps {}
#how_to_find_gps h4 {
    width:100%;
    margin: 0 auto 30px;
    font-size: 2rem;
    text-align:center;
}
#how_to_find_gps h4 span {
    display:block;
    font-size:1.2rem;
    font-weight: 700;
}

.shopList {
    width:90%;
    max-width:800px;
    margin: 50px auto;
}
.shopList #search {
    margin: 0 auto 50px;
}

.shopList ul {}
.shopList ul li {
    padding:0;
}
.shopList ul li a {
    display:flex; flex-flow:row wrap; justify-content:flex-start; align-content:center; align-items:center;
}
.shopList ul li .imgOuter {
    margin: 0 20px 0 0;
}

.shoplistText h5 {
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.5;
}
.distance {
    padding-left:10px;
    color: #9b9b9b;
}

@media only screen and (max-width:1000px){
    
    #how_to_find_gps h4 {
        margin: 0 auto;
        font-size: 1.5rem;
    }
    #how_to_find_gps h4 span {
        display:block;
        font-size:1rem;
    }
    .shoplistText {
        width:100%;
        min-height: 120px;
        padding: 0;
        margin: 0;
    }
    .shoplistText h5 {
        width:100% !important;
        padding-left: 140px;
        font-size: 1rem;
    }
    .distance {
        padding-left:0;
        display: block;
    }
    .shoplistText p {
        min-height: 50px !important;
        font-size:0.75rem;
        letter-spacing: 0.05em;
    }
}



/* other-link */

ul.other-link {
    width:90%;
    max-width:1280px;
    margin: 50px auto 100px;
    padding:0;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
}
ul.other-link li {
    width:24%;
    margin:5px;
}
ul.other-link li a {
    padding: 20px 0;
    display: block;
    font-size: 1.1rem;
    font-weight: 500;
    color: #252222;
    text-align: center;
    text-decoration: none;
    line-height: 1.3;
    border-radius: 50px;
    border:solid 3px #252222;
    position: relative;
    transition: .3s;
}
ul.other-link li a::before {
    content: "";
    width: 9px;
    height:9px;
    margin:auto;
    position:absolute; top:0; bottom:0; right:20px;
    vertical-align: middle;
    border-top: 2px solid #252222;
    border-right:2px solid #252222;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: .3s;
}
ul.other-link li a:hover::before {
    right:15px;
    border-top: 2px solid #e60012;
    border-right:2px solid #e60012;
}
ul.other-link li:nth-of-type(1) a {
    letter-spacing: 0;
}
ul.other-link li a:hover {
    color:#e60012;
    border:solid 3px #e60012;
}

@media only screen and (max-width:1100px){

    ul.other-link {
        max-width:500px;
        padding: 30px 0;
        display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
    }
    ul.other-link li {
        width:100%;
        margin:10px;
    }
    ul.other-link li a {
        padding: 20px 0;
    }
}



/* other 

.other {
    width:100%;
    margin: 0 auto;
    padding: 50px 0;
}
.other ul {
    width:100%;
    margin: 0 auto;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
}
.other ul li {
    width:20%;
    margin:0.5%;
    border-radius: 50px;
    border:solid 3px #252222;
}
.other ul li:hover {
    border:solid 3px #252222;
}
.other ul li a {
    padding: 10px 0;
    display: block;
    color: #252222;
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
}

@media only screen and (max-width:1000px){
    
    .other ul {
        width:70%;
        margin: 0 auto;
    }
    .other ul li {
        width:100%;
        margin: 10px 0;
    }
}

*/