@charset "UTF-8";

/* common
-------------------------------------------------- */
.titlearea{
width: 100%;
height:300px;
background-size:cover;
background-color: #eee;
}
.bg_blue{
background-color: #E6F4FF;
}
.bg_wasi_w{
width: 100%;
background-color:#f5f5f5; 
/*background-image: url("../../img/common/wasi_w.jpg");
background-size: contain;*/
}
.fuwafuwa {
-webkit-animation:fuwafuwa 3s infinite linear alternate;
animation:fuwafuwa 3s infinite linear alternate;
}
@-webkit-keyframes fuwafuwa {
0% {-webkit-transform:translate(0, 0) rotate(-5deg);}
50% {-webkit-transform:translate(0, -5px) rotate(0deg);}
100% {-webkit-transform:translate(0, 0)rotate(5deg);}
}
@keyframes fuwafuwa {
0% {transform:translate(0, 0) rotate(-5deg);}
50% {transform:translate(0, -5px) rotate(0deg);}
100% {transform:translate(0, 0)rotate(5deg);}
}

/* スライダー
-------------------------------------------------- */
.slider{
text-align: center;
position: relative;
margin-bottom: 10px;
}
.slider01_copy1{
position: absolute;
width: 42%;
top:4%;
left:2%;
animation: copy01 4s 0s forwards;
}
@keyframes copy01 {
    0% {
        opacity: 0;
    }
    10%{
        opacity: 0;
    }
    100%{
        opacity: 1;
        transform: translateX(20px);
    }
}
.slider01_copy2{
position: absolute;
width: 42%;
bottom:4%;
right:2%;
animation: copy02 5s 0s forwards;
}
@keyframes copy02 {
    0% {
        opacity: 0;
    }
    25%{
        opacity: 0;
        transform: translateX(0px);
    }
    100%{
        opacity: 1;
        transform: translateX(-20px);
    }
}

.slide05_copy{
position: absolute;
width: 45%;
top:5%;
left:4%;
}

/* 新着情報
-------------------------------------------------- */
.news_area{
padding-top: 10px;
padding-bottom: 30px;
max-width: 1200px;
margin: 0 auto;
margin-bottom: 30px;
}
.news_shop_wrap{
display: flex;
flex-wrap: wrap;
width: 96%;
margin: 0 auto;
}
.news{
width: 65%;
}
.shopping{
width: 35%;
}

.news_title{
text-align: left;
font-size: 20px;
font-weight: 700;
color: #112444;
}
.news_title span{
margin-left: 30px;
font-weight: 400;
font-size: 17px;
color: #999;
}
.news_wrap{
padding-right: 40px;
}
.news_inport{
height: 290px;
}
.news_text{
text-align: left;
font-family: Sans-serif;
font-weight: normal;
font-size: 15px;
padding-top: 20px;
}
.news_text li{
display: block;
margin-bottom: 20px;
overflow: hidden;
width: 100%;
height: 35px;
}
.midasi{
}
.catName,.category {
font-size: 12px;
font-weight: bold;
color: #fff;
display: inline-block;
border-radius: 3px;
text-align: center;
width: 80px;
margin-right: 15px;
padding: 3px 0 3px 0;
}
.cat-0 .catName, .osirase {
background-color: #4dade8;
}
.cat-1 .catName, .syohin {
background-color: #ef9000;
}
.cat-2 .catName, .event{
background-color: #7ab12a;
}
.cat-3 .catName {
background-color: #e14382;
}

.news_text .day{
font-size: 14px;
margin-right: 10px;
}
.news_text a{
color: #000;
text-decoration: underline;
}

.ichiran{
text-align: right;
font-family: Sans-serif;
font-weight: 400;
font-size: 16px;
margin-top: 10px;
}
.ichiran p{}

.shopping{
}
.shopping_wrap{
}
.shopping_title{
text-align: left;
font-size: 20px;
font-weight: 700;
color: #112444;
margin-bottom: 5px;
}
.shopping_title span{
margin-left: 30px;
font-weight: 400;
font-size: 17px;
color: #999;
}

.shopping_box{
height: 340px;
background-color: #fff;
border: 5px solid #bfc9dc;
padding: 20px 20px 30px 20px;
}
.shopping_banner li{
display: block;
text-align: center;
height: 70px;
line-height: 70px;
background-color: #112444;
font-size: 18px;
font-weight: 700;
border-radius: 10px;
margin-bottom: 10px;
position: relative;
}
.shopping_banner li::after{
content: "　";
position: absolute;
display: block;
width: 17px;
background-image:url("../img/common/arrow_thin.png");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
top: 0;
right: 10px;
}
.shopping_banner li a{
color: #fff;
}
.shopping_banner li:hover{
opacity: 0.7;
transition: 0.3s;
}

.shopping_guide{
text-align: left;
font-family: Sans-serif;
font-weight: normal;
font-size: 15px;
line-height: 180%;
}
.guide{
margin-top: 20px;
padding-top: 7px;
border-top: 1px solid #ccc;
}
.cashless{
max-width: 1055px;
margin: 0 auto;
margin-bottom: 80px;
}


/* 特撰酒・商品案内
-------------------------------------------------- */
.top_special_title{
background-image: url("../img/top/special_title_img.jpg");
background-position:bottom center;
position: relative;
}
.top_special_title p{
position: absolute;
font-weight: bold;
color: #fff;
font-size: 32px;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
margin: auto;
text-shadow:0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000;
}
.special{
padding-bottom: 80px;
}
.special .special_wrap{
padding: 0;
max-width: 1200px;
margin: 0 auto 60px auto;
padding-top: 50px;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
.special .special_box{
flex-basis:46%;
box-shadow: 1px 1px 1px #aaa;
margin: 1% 1% 3% 1%;
}
.special .product_banner{
max-width: 550px;
margin: 0 auto;
margin-top: 30px;
background-color: #000;
text-align: center;
height: 65px;
line-height: 65px;
font-size: 20px;
font-weight: 700;
box-shadow: 1px 1px 1px #aaa;
position: relative;
}
.special .product_banner::after{
content: "　";
position: absolute;
display: block;
width: 17px;
background-image:url("../img/common/arrow_thin.png");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
top: 0;
right: 10px;
}
.special .product_banner:hover{
opacity: 0.7;
transition: 0.3s;
}
.special .product_banner a{
color: #fff;
display: block;
}

/* 工場見学
-------------------------------------------------- */
.factory{
padding-top: 60px;
padding-bottom: 80px;
}
.top_factory_title{
background-image: url("../img/top/factory_title_img.jpg");
background-position:center center;
position: relative;
}
.factory_title_text{
position: absolute;
width: 350px;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
margin: auto;
}
.factory_pop{
position: absolute;
}
.pop01{
top:30px;
left:13%;
width: 210px;
}
.pop02{
bottom:-70px;
right:13%;
width: 180px;
}

.factory_copy {
display: block;
margin-bottom: 50px;
}
.factory_copy dt{
text-align: center;
font-size: 24px;
line-height: 160%;
font-weight: 700;
color: #0f2759;
margin-bottom: 30px;
}
.factory_copy dd{
text-align: center;
font-family: Sans-serif;
font-size: 16px;
}
.factory_info{
max-width: 1000px;
margin: 0 auto;
background-color: #fff;
padding: 30px 50px 20px 50px;
}
.info_box{
font-size: 15px;
text-align: left;
font-family: Sans-serif;
}
.info_title{
position: relative;
}
.info_title p{
font-size: 20px;
font-weight: 700;
color: #0f2759;
font-family: serif;
margin-bottom: 10px;
}
.info_freeicon{
width: 90px;
position: absolute;
right:10px;
top:-15px;
}
.info_img{
margin-bottom: 20px;
}
.info_img .float-left {
    margin-left: -14px;
    width: 52%;
}
.info_img .float-left p {
    margin-left: 14px;
}
.info_img li {
    width: 49%;
}
.info_box p {
}
.info_box p span{
display: inline-block;
background: #112444;
color: #fff;
width: 100%;
text-align: center;
font-size: 13px;
margin-top: 7px;
margin-right: 10px;
padding: 1px 0px 1px 0px;
margin-bottom: 5px;
}
.factory_btn{
margin: 0 auto;
max-width: 500px;
margin-top: 20px;
margin-bottom: 15px;
font-family: Sans-serif;
font-weight: normal;
}
.factory_btn a{
display: block;
height: 60px;
line-height: 60px;
text-align: center;
color: #fff;
background-color: #183b8c;
border-radius: 5px;
box-shadow: 1px 1px 5px #999;
font-size: 19px;
}
.factory_btn span{
font-size: 14px;
}
.factory_btn a:hover{
opacity: 0.7;
transition: 0.3s;
}

/* トピックス・FACEBOOK
-------------------------------------------------- */
.topics{
padding-top: 60px;
padding-bottom: 60px;
}
.topics_row{
max-width: 1040px;
margin: 0 auto;
}
.topics_wrap{
}
.topics_title p, .fb_title p{
font-size: 20px;
font-weight: bold;
color: #112444;
text-align: left;
margin-bottom: 3px;
}
.topics_title p span{
font-size: 16px;
margin-left: 15px;
font-weight: 400;
color: #999;
}
.topics_box{
}
.topics_list{
margin-top: 20px;
}
.gift, .gift_tate{
text-align: left;
font-family: Sans-serif;
margin-bottom: 40px;
}
.gift p, .gift_tate p{
display: block;
margin-bottom: 5px;
}
.gift a, .gift_tate a{
color: #1a86d2;
}
.gift_tate img {
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
}
.topics_banner{
margin-bottom: 15px;
}
.fb_box{
padding-left: 60px;
}
.fb-page{
width: 100%;
margin-top: 20px;
}