﻿@charset "utf-8";

/* ■■■メインイメージ■■■*/

.bg-slider {
width: 100%;
background-position:center center;
background-size: cover;
}

.bg-slider-title{
text-align:center;
}

.bg-slider-title img{
width: 500px;
height: auto;
}

.contents {
display: flex;
/*background-color: rgba(0,0,0,0.5);*/
width: 100%;
align-items: center;
justify-content: center;
}

/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){

.sp_bg-slider-title {
display:none;
}

.bg-slider,
.contents {
height: 723px;
}


}
/* min-width: 769px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

.bg-slider,
.contents {
height: 430px;
}

.bg-slider-title {
display:none;
}

.sp_bg-slider-title img{
width: 125px;
height: auto;
}


}
/* max-width: 768px @end */

/* ■■■ツイッター■■■*/


#twitter_Area {
width: 1114px;
padding: 55px 0 200px 0;
text-align: left;
margin: 0 auto;
position: relative;
}


#twitter_Cont_Area {
background-color: #FFF;
padding: 25px;
}

.copy01 img {
width: 390px;
height: auto;
}

/* max-width: 1142px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1142px){

#twitter_Area {
width: 100%;
padding: 55px 0 100px 0;
}

#twitter_Cont_Area {
background-color: #FFF;
padding: 25px;
}

.copy01 img {
width: 290px;
height: auto;
}


}
/* max-width: 1142px @end */

/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){


#twitter_Cont_Area {
width: 520px;
}


.copy01 {
position: absolute;
top: -140px;
right: 0;
}



}
/* min-width: 769px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){


#twitter_Area {
width: 100%;
padding: 205px 0 50px 0;
margin: 0;
}

#twitter_Cont_Area {
background-color: #FFF;
margin: 327px 20px 0 20px;
padding: 10px;
}

.copy01 {
position: absolute;
top: -80px;
left: 60%;
transform: translateX(-60%);
-webkit- transform: translateX(-60%);
margin: auto;
}

.copy01 img {
min-width: 279px;
height: auto;
}

}
/* max-width: 768px @end */


/* ■■■コンセプト■■■*/

#concept_Area {
background-image : url(../common/images/bg01.gif);
background-repeat: repeat-y;
background-position: 100px 0;
text-align: left;
padding-bottom: 100px;
}

#conceptL {
float: left;
width: 50%;
}

#conceptL img {
width: 100%;
height: auto;
}

#conceptR {
float: right;
width: 50%;
}

#conceptR .concept_bg01 {
height: 100px;
background-image : url(../common/images/bg02.gif);
background-repeat: repeat-y;
}

#conceptR .concept01 {
margin: 70px 0 0 135px;
background-image : url(../common/images/nav_icon01.svg);
background-position : 0 0;
background-repeat: no-repeat;
background-size: 7px 7px;
padding-top: 30px;
}

#conceptR .concept02 {
border-left: 1px solid #3c6277;
margin-left: 3px;
word-break: break-all;
line-height: 42px;
}

#conceptR .title_fc {
padding: 0 0 0 68px;
}


#conceptR .concept03 {
padding: 50px 10% 0 68px;
color: #FFF;
line-height: 42px;
}

/* max-width: 1142px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1142px){

#concept_Area {
padding-bottom: 80px;
}

#conceptR .concept01 {
margin: 70px 0 0 50px;
}

#conceptR .title_fc {
padding: 0 0 0 50px;
}

#conceptR .concept03 {
padding: 50px 5% 0 50px;
}

}
/* max-width: 1142px @end */

/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){

.sp_concept_photo {
display: none;
}



}
/* min-width: 769px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

#concept_Area {
background-image : none;
text-align: center;
padding: 50px 0;
background-color: #0e3d57;
}

#conceptL,
.concept_bg01 {
display: none;
}

#conceptR {
float: none;
width: 100%;
}

#conceptR .concept01 {
margin: 0 0 0 0;
padding-top: 100px;
background-image : url(../common/images/ttl_bg01.svg);
background-position : center 0;
background-repeat: no-repeat;
background-size: 7px 70px;
}

#conceptR .concept02 {
border-left: none;
margin-left: 0;
}

#conceptR .concept03 {
padding: 40px 0 0 0;
color: #FFF;
line-height: 32px;
}

.sp_concept_photo {
padding-top : 40px;
}

#conceptR .title_fc {
padding: 0;
}

}
/* max-width: 768px @end */


/* ■■■ドリンク■■■*/

#drink_Area {
padding: 45px 0 0 0;
color: #FFF;
line-height: 42px;
}

#slideArea {
width: 100%;
margin-top: 40px;
}

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

#drink_Area {
padding: 40px 0 0 0;
line-height: 32px;
}

}
/* max-width: 768px @end */


/* ■■■マスター■■■*/

#master_Area {
background-image : url(../common/images/bg01.gif);
background-repeat: repeat-y;
background-position: right 100px top 0;
text-align: left;
margin-top: 100px;
padding-bottom: 100px;
}

#masterL {
float: left;
width: 60%;
text-align: right;
}

#masterL .master_bg01 {
height: 100px;
background-image : url(../common/images/bg02.gif);
background-repeat: repeat-y;
}

#masterL .title_fc {
padding: 0 55px 0 0;
}

#masterL .master01 {
margin: 70px 16% 0 135px;
background-image : url(../common/images/nav_icon01.svg);
background-position : right 0;
background-repeat: no-repeat;
background-size: 7px 7px;
padding-top: 30px;
}

#masterL .master02 {
border-right: 1px solid #3c6277;
margin-right: 3px;
word-break: break-all;
line-height: 42px;
}

#masterL .master03 {
padding: 40px 68px 0 0;
color: #FFF;
}

#masterL .master03 .ms_fc01 {
margin-top: 10px;
color: #6a8092;
font-size: 12px;
}

#masterL .master04 {
margin-top: 70px;
line-height: 42px;
text-align: left;
}


#masterR {
width: 40%;
float: right;
}

#masterR img {
width: 100%;
height: auto;
}

/* max-width: 1142px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1142px){

#master_Area {
padding-bottom: 80px;
}

#masterL .master01 {
margin: 70px 50px 0 20px;
}

#masterL .master03 {
padding: 40px 50px 0 0;
}

}
/* max-width: 1142px @end */

/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){

.sp_master_photo {
display: none;
}

}
/* min-width: 769px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

#master_Area {
background-image : none;
text-align: center;
padding: 50px 0;
background-color: #0e3d57;
margin-top: 70px;
}

#masterR,
.master_bg01 {
display: none;
}

#masterL {
float: none;
width: 100%;
text-align: center;
}

#masterL .master01 {
margin: 0;
padding-top: 100px;
background-image : url(../common/images/ttl_bg01.svg);
background-position : center 0;
background-repeat: no-repeat;
background-size: 7px 70px;
}

#masterL .master02 {
border-right: none;
margin-right: 0;
}

#masterL .master03 {
padding: 40px 0 0 0;
color: #FFF;
line-height: 42px;
}

#masterL .master03 .ms_fc01 {
margin-top: 0;
}

#masterL .master04 {
text-align: left;
padding: 0 20px;
line-height: 32px;
margin-top: 40px;
}



.sp_master_photo {
padding-top : 40px;
}

#masterL .title_fc {
padding: 0;
}

}
/* max-width: 768px @end */


/* ■■■sns■■■*/

#sns_Area {
padding: 100px 0;
}

#sns_cont {
color: #FFF;
line-height: 42px;
}


#snsR {
width: 100%;
text-align: center;
margin-top: 60px;
margin-right: auto;
margin-left: auto;
padding: 0;
}

#snsR ul {
display: flex;
justify-content: center;
}

#snsR ul li:nth-child(2) {
padding: 0 20px;
}

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

#snsR ul {
display: block;
}


#snsR ul li:nth-child(2) {
padding: 20px 0;
}

}
/* max-width: 1100px @end */


/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){

#snsL {
float: left;
width: 50%;
text-align: right;
margin-top: 60px;
}

.facebook iframe {
width: 500px;
}

}
/* min-width: 769px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

#sns_Area {
padding: 50px 0 70px 0;
}

#snsL {
float: none;
text-align: center;
margin: 30px 20px 0 20px;
}

#snsR {
margin-top: 30px;
padding: 0;
}




#sns_cont {
padding: 40px 20px 0  20px;
text-align: left;
line-height: 32px;
}

.facebook {
width: 100%;
max-width: 320px;
margin: 0 auto;
}


}
/* max-width: 768px @end */




/* ■■■アクセス■■■*/

#access_Area {
padding: 100px 0 0 0;
background-color: #0e3d57;
}

#access_cont {
padding: 60px 0 0 0;
}

#access_cont iframe{
display: block;
}


/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

#access_Area {
padding: 50px 0 0 0;
}

#access_cont {
padding: 40px 0 0 0;
}

}
/* max-width: 768px @end */
