﻿/**
 * Created by PhpStorm.
 * User: KenX64
 *  fix: myura
 * Date: 14/11/22
 * Time: 18:34
 */

div#storeinfo_container {
    width: 100%;
    margin: 0 auto;
    background-color: #ffffff;
    min-height: 90%;

}

div#container_top {
    min-width: 980px;
    max-width: 1280px;
    height: 430px;
    margin: 0 auto 0 auto;
    padding-top: 50px;
    display:-ms-flexbox;
    display:-moz-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;


}

.lt-ie10 div#container_top div#control_container, .lt-ie10 div#container_top div#map_container{
    float: left;

}

.lt-ie10 div#container_top div#control_container {
    margin-top: 150px;
}


    div#control_container {
        width: 300px;
        display:-ms-flexbox;
        display:-moz-box;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;

    }

    div#control_container img {
        margin-top: 14px;
        cursor: pointer;
    }

    div#control_container div.controller {
        height :70px;
        text-align: center;
    }

    div#control_container div#japan_controller img{
        display: none;
    }

    div#control_container div#arrow_controller img{
         display: none;
     }

    div#control_container div#world_controller img{
        opacity: 0.5;
        display: none;
    }



    div#map_container {
        text-align: center;
        overflow: hidden;
        position: relative;
        top: -50px;
    }

div#map_container div#map_inner {
    z-index: 0;
}

div#map_container img {


}

div#map_container img#japan_map {
    display: none;
}


div#map_container img#world_map {
    display: none;
}


/* マップ内のリンクボタンスタイル */

/* ********************** */
/* マップポイントコンテナ定義 */
/* ********************** */
div#map_container div.button_cont {
    display: none;
    position: absolute;
    top:0;
    left:0;

}

div#map_container div#world_button_container {
    display: none;
}


/* ********************** */
/* 赤丸ポイント定義 */
/* ********************** */
div#map_container div.button_cont a{
    position: absolute;
    display: block;
    border: solid 1px #ccc;
    border-radius: 100px;
    background-color: #FF0000;

}

div#map_container div#jpn_button_container a#fukuoka {
    width: 25px;
    height: 25px;
    top:244px;
    left:197px;
}

div#map_container div#jpn_button_container a#oita {
    width: 15px;
    height: 15px;
    top:270px;
    left:215px;
}

div#map_container div#jpn_button_container a#kantou {
    width: 24px;
    height: 24px;
    top:316px;
    left:412px;
}

div#map_container div#jpn_button_container a#okinawa {
    width: 15px;
    height: 15px;
    top:395px;
    left:78px;
}

div#map_container div#world_button_container  a#cambodia {
    width: 15px;
    height: 15px;
    top:230px;
    left:160px;
}


div#map_container div#world_button_container  a#hong-kong {
    width: 15px;
    height: 15px;
    top:85px;
    left:450px;
}

div#map_container div#world_button_container  a#usa {
    width: 22px;
    height: 22px;
    top:260px;
    left:930px;
}


/* ********************** */
/* 波紋リング定義 */
/* ********************** */
div#map_container div.button_cont a span.ring {
    background: rgba(249, 30, 30, 0.8);
    position: absolute;
    z-index: 2;
    border-radius: 100px;
    top: -0px;
    left: -0px;
}



div#map_container div.button_cont a:hover span.ring {
    -webkit-animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    animation: pulsate 1s ease-out;  /* スピードなど */
    animation-iteration-count: infinite;
}


div#map_container div#jpn_button_container a#fukuoka span.ring{
    width: 27px;
    height: 27px;
}


div#map_container div#jpn_button_container a#oita span.ring{
    width: 15px;
    height: 15px;

}

div#map_container div#jpn_button_container a#kantou span.ring{
    width: 24px;
    height: 24px;
}

div#map_container div#jpn_button_container a#okinawa span.ring{
    width: 15px;
    height: 15px;
}

div#map_container div#world_button_container a#cambodia span.ring{
    width: 15px;
    height: 15px;
}

div#map_container div#world_button_container a#hong-kong span.ring{
    width: 15px;
    height: 15px;
}

div#map_container div#world_button_container a#usa span.ring{
    width: 22px;
    height: 22px;
}



/* ********************** */
/* 波紋アニメーション定義 */
/* ********************** */
@-webkit-keyframes pulsate {
    0%   { transform: scale(1, 1); }
    50%  { opacity: 0.3; }
    100% { transform: scale(4, 4); opacity: 0.0; }
}
@-moz-keyframes pulsate {
    0%   { transform: scale(1, 1); }
    50%  { opacity: 1; }
    100% { transform: scale(4, 4); opacity: 0.0; }
}
@keyframes pulsate {
    0%   { transform: scale(1, 1); }
    50%  { opacity: 1; }
    100% { transform: scale(4, 4); opacity: 0.0; }
}

/* ********************** */
/* ストアリストスタイル定義 */
/* ********************** */
div.store_list_container {
    clear: both;
    width: 980px;
    min-height: 532px;
    margin : 0 auto;
    display:-ms-flexbox;
    display:-moz-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    /* flex-wrap old syntax */
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -ms-box-lines: multiple;
    -o-box-lines: multiple;
    box-lines: multiple;

    /* end flex-wrap old syntax */

    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content:flex-start;
    position: relative;

}

div.close_button_cont {
    display: none;
    position: fixed;
    right: 50px;
    bottom: 50px;
    z-index: 10002;
}

div.entry_button_cont {
    display: none;
    position: fixed;
    right: 200px;
    bottom: 50px;
    z-index: 10002;


}

div.entry_button_cont img:hover {
    opacity: 0.7;
}

span.store_text_cont {
    display: block;
    text-align: center;
    position: relative;
    top: -30px;
    font-size: 14px;
}

.lt-ie10 div.store_list_container div {
    float: left;
}

div.store_list_container div.store_info {
    display: none;
    margin-right: 25px;
}

div.store_list_container div.store_info:hover {
    opacity: 0.5;
}

div.store_list_container div.store_info a {
    display: block;
    width: 100%;
}

div.filter {
    width: 100%;
    height: 100%;
    position: fixed;
    top:0;
    left:0;
    bottom: 0;
    right: 0;
    background-color: #444444;
    opacity: 0.9;
    z-index: 199;
    display: none;
}

.lt-ie10 div.filter {
    -ms-filter: alpha(opacity=40);
}

div#store_info_container {
    width: 900px;
    position: fixed;
    height: 500px;
    top:0;
    left:0;
    background-color: #EFEFEF;
    display: none;
    z-index: 1002;
}

div#store_info_container div.delete_container {
    text-align: right;
    padding: 10px 10px 0 0;
}

div#store_info_container div.delete_container img {
    cursor: pointer;
}

div#store_info_container div.store_info_box div.si_top_container { /* deleteボックスを除いた部分 */
    display:-ms-flexbox;
    display:-moz-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    height: 420px;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: center;
    justify-content:center;
}

div#store_info_container div.store_info_box div.si_top_container div.si_tleft,
div#store_info_container div.store_info_box div.si_top_container div.si_tright
{
    float: left;
}

div.store_info_box div.si_tleft {
    width: 250px;
    line-height: 1.2em;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-grow: 0;
    -o-flex-grow: 0;
    flex-grow: 0;
}

div.store_info_box div.si_tleft img.main_img {
    margin-left: 15px;
}

div.store_info_box div.si_tleft div.tool_link {
    margin-top: 15px;
}

div.store_info_box div.si_tleft div.tool_link a {
    margin-right: 15px;
}

div.store_info_box div.si_tleft div.si_tool_cont{
    padding-left: 20px;
}

div.store_info_box div.si_tleft span.zip{
    font-size: 13px;
}

div.store_info_box div.si_tleft span.address1{
    font-size: 13px;
}

div.store_info_box div.si_tleft span.address2{
    font-size: 12px;
}


div.store_info_box div.si_tright {
    width: 450px;
    -webkit-flex-grow: 3;
    -moz-flex-grow: 3;
    -ms-flex-grow: 3;
    -o-flex-grow: 3;
    flex-grow: 3;
}

div.store_info_box div.si_tright h1.si_head {
    display: block;
    font-size: 20px;
    width: 92%;
    border-bottom: solid thin;
}

div.store_info_box div.si_tright div.si_img_cont {
    width : 94%;
    text-align: center;
    margin-top: 15px;
}

div.store_info_box div.si_holiday_cont h3 {
    font-size: 14px;
    display: block;
    border-bottom: solid thin;
}

div.store_info_box div.si_time_cont h3 {
    font-size: 12px;
    display: block;
    width: 92%;
    border-bottom: solid thin;
    margin: 10px 0;
}

div.store_info_box div.si_time_cont ul {
    margin: 0;
    padding: 0;
}

div.store_info_box div.si_time_cont ul li {
    list-style: none;
    font-size: 13px;
    margin : 0;
    padding:0;
    display:-ms-flexbox;
    display:-moz-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
}



div.store_info_box div.si_time_cont ul li span {
    display: block;
}

div.store_info_box div.si_time_cont ul li span.week {
    width: 20%;
    font-weight: bold;
}

div.store_info_box div.si_time_cont ul li span.time {
    font-size: 13px;

}

.lt-ie10 div.store_info_box div.si_time_cont ul li {
    display: block;
    overflow: hidden;
}

.lt-ie10 div.store_info_box div.si_time_cont ul li span {
    float: left;
}



div.store_info_box div.si_holiday_cont span.holiday p {
    font-size: 13px;
    line-height: 1.3em;
}

div.si_tright div.si_img_cont img {
    margin-right: 15px;
    width: 145px;
}

div.si_info_cont {
    height: 130px;
}

div.si_item_container {
    display:-ms-flexbox;
    display:-moz-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    height: 130px;
    overflow: hidden;
    clear: both;
}


div.si_item_container  h3 {
    font-size: 14px;
    width: 95%;
    border-bottom: thin solid;
}

.lt-ie10 div.si_item_container div {
    float: left;
}

div.si_item_container div.item_img_cont{
    width: 25%;
    text-align: center;
}



div.si_item_container div.item_img_cont img {
    width: 130px;
    margin-top: 20px;
}

div.item_disc_cont {
    width: 70%;
}


div.si_item_container div.item_disc_cont p {
    font-size: 12px;
}

div.si_holiday_cont {
    width: 80%;
    margin-left: 20px;
}

div.sns_link_cont {
    width: 80%;
    margin-left: 20px;
}

div.sns_link_cont img.facebook {
    height : 30px;
}


/* ********************** */
/* ペジネーション */
/* ********************** */

div.pagination_container {
    width: 980px;
    margin: 0 auto;
    position: relative;

}

div.pagination_container div.pagination {
    display:-ms-flexbox;
    display:-moz-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -webkit-justify-content: center;
    justify-content: center;



}

div.pagination_container div.pagination span {
    display: block;
    background-color: #333333;
    color: #FFFFFF;
    margin-right: 20px;
}

div.pagination_container div.pagination span a {
    color: #FFFFFF;
    text-decoration: none;
    text-align: center;
    margin: 0 auto;
    display: block;
    width: 25px;
    height: 25px;
    vertical-align: middle;
    padding: 0;
    margin: 0;
    padding: 5px;
}



