@charset "utf-8";
/* CSS Document */
*, *:before, *:after { box-sizing:border-box; margin:0; }
img { max-width:100%; height:auto; vertical-align:top; }
a{text-decoration: none;}
a:hover{opacity: 0.5;text-decoration: underline;}

body {
font-family: "meiryo","メイリオ","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
font-size: 16px;
font-weight: 300;
line-height: 1.5;
color: #333;
/*background: #000;*/
}
.sp{display:none;}
.pc{display:block;}

/*header -----------------------------------------------------------------*/
header{
width: 100%;
height: 60px;
position: fixed;
top: 0;
z-index: 10;
background: #000;
}
.logo_kyoto{
width: 1100px;
margin: 0 auto;
padding: 0.5em 2em;
display: flex;
justify-content: space-between;
}
a.link_logo{width: 220px;display: block;}
.header_wrap{
width: 100%;
position: relative;
background: #dcdcdc;
margin-top: 60px;
}
.swiper{
width: 100%;
height: 600px;
}
.swiper-wrapper{
width: 100%;
height: 600px;
}
.swiper-slide{height: 600px;position: relative;}
.swiper-slide img{
max-width: unset;
position: absolute;
transform: translate(-50%, -50%);
min-width: 1100px;
}

.swiper-slide img.slide_img01 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img02 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img03 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img04 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img05 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img06 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img07 {width: 100%;top: 50%;left: 50%;}

.title_wrap{
position: absolute;
height: 550px;
z-index: 2;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
opacity: 0;

/* アニメーション */
animation: fadeIn 3s linear;
animation-fill-mode: both;
}
.title_wrap img{max-height: 100%;}

@keyframes fadeIn{
0%{opacity: 0;}
40%{opacity: 0;}
100%{opacity: 1;}
}

/*Language -----------------------------------------------------------------*/
.lang_btn{width: 70px;padding-top: 2px;}
.lang_btn_co{
position: relative;
text-align: center;
}
.lang_btn label{
display: block;
line-height: 1;
cursor: pointer;
font-size: 0.8em;
color: #fff;
}
.lang_btn label i{font-size: 2em;margin-bottom: 2px;}
.lang_btn a{display: block;text-decoration: none;}
input{display: none;}
.lang_btn li{height: 0;overflow: hidden;transition: all 0.5s;}
ul#lang_lists{width: 150px;margin-top: 10px;margin-left: -57px;}
#lang_lists li{text-align: center;opacity: 0;}
#lang_list:checked ~ 
#lang_lists li{
height: 50px;
opacity: 1;
}
#lang_lists li a{
padding: 1em;
background: rgba(0, 0, 0, 0.7);
color: #fff;
}
#lang_lists li a:hover{
opacity: 1;
background: #fff;
color: #4c4c4c;
}

/*footer -----------------------------------------------------------------*/
footer{padding: 2em 0 0.5em;}
.footer_logo_kyoto{
width: 1100px;
margin: 0 auto;
padding: 0 0 2em;
}
.footer_logo_kyoto a{width: 220px;display: block;}

.footer_wrap{color: #fff;}
.footer_menu{
display: flex;
flex-wrap: wrap;
width: 100%;
margin-bottom: 2em;
}
.footer_menu a{
color: #fff;
margin-right: 2em;
}
.footer_wrap .footer_title{
font-size: 1.3em;
color: #fff;
border-bottom: dotted 3px #438c99;
line-height: 1.7;
width: 100%;
margin-bottom: 0.6em;
}
.footer_wrap .copy{
width: 100%;
text-align: center;
font-size: 0.9em;
}

/*content -----------------------------------------------------------------*/
section{
margin: 0px 0 3em;
padding: 2em 0;
}
.section_mb0{margin-bottom: 0;}
.bg_dc{background: #dcdcdc;}
.bg_f1{background: #f1f1f1;}
.bg_b{background: #000;}

.content{
width: 1100px;
margin: 0 auto ;
padding: 0 2em;
display: flex;
flex-wrap: wrap;
}
.top_info{text-align: center;}
.top_info h1{
font-size: 20px;
text-align: center;
width: 100%;
margin-bottom: 0.5em;
}
.top_info p{
margin-bottom: 1em;
width: 100%;
font-size: 1.2em;
}
.img_wrap{justify-content: center;margin: 1em auto;}
.kyoto_img{
width: calc(100% / 3 - 10px);
margin: 0 5px 10px;
}
.insta_wrap{margin-bottom: 0em;}
.insta_wrap h2{
width: 100%;
text-align: center;
color: #000;
font-size: 2em;
margin-bottom: 0.5em;
}
.insta_wrap h2 i{margin-right: 0.3em;}
.insta_wrap p{
text-align: center;
width: 100%;
line-height: 1.9;
}
.insta_wrap p i{margin-left: 0.3em;}
.insta_btn_wrap{
margin: 2em auto 1em;
text-align: center;
width: 50%;
}
.insta_btn_wrap a{
font-size: 1.5em;
background: #000;
color: #fff;
font-weight: bold;
border-radius: 50px;
padding: 0.3em 0 0.2em;
display: block;
}
.insta_btn_wrap a i{margin-right: 0.3em;}
.map_wrap{
width: 100%;
height: 500px;
margin-top: -2em;
}
.shop_detail{padding-top: 1em;}
.shop_detail p{
width: 100%;
text-align: center;
font-size: 1.3em;
}
.shop_detail i{margin-right: 0.3em;}

@media screen and (max-width:768px){
.sp{display:block;}
.pc{display:none;}
/*header -----------------------------------------------------------------*/
header{height: 51px;}
.logo_kyoto{width: 100%;padding: 8px;align-items: flex-start;}
.lang_btn {padding-top: 0px;margin-right: 10px;}
.lang_btn_co{height: 43px;}
.lang_btn label i{font-size: 1.7em;}
ul#lang_lists{
width: 150px;
margin-top: 0px;
margin-left: -62px;
}
a.link_logo {width: 180px;}
a.link_lang{font-size: 0.9em;}
.header_wrap{margin-top: 51px;}
.swiper{height: 500px;}
.swiper-wrapper{height: 500px;}
.swiper-slide{height: 500px;}
.swiper-slide img{min-width: auto;width: auto !important;height: 100%;}

.swiper-slide img.slide_img01 {left: 50%; top: 50%;}
.swiper-slide img.slide_img02 {left: 90%; top: 50%;}
.swiper-slide img.slide_img03 {left: 50%; top: 50%;}
.swiper-slide img.slide_img04 {left: 30%; top: 50%;}
.swiper-slide img.slide_img06 {left: 50%; top: 50%;}
.swiper-slide img.slide_img07 {left: 50%; top: 50%;}

.title_wrap{width: 60%;height: auto;}

/*footer -----------------------------------------------------------------*/
footer{}
.footer_logo_kyoto{width: 100%;padding: 0 0 1.5em;}
.footer_logo_kyoto a{width: 50%;}
.footer_menu a{line-height: 2.5em;}

/*content -----------------------------------------------------------------*/
section{margin: 0px 0 2em; padding: 1.5em 0;}
.content{width: 94%; padding: 0;}
.top_info{text-align: left;}
.top_info h1{font-size: 18px;margin-bottom: 1em;}
.top_info p{font-size: 1.0em;}
.img_wrap{justify-content: center;}
.kyoto_img{width: calc(100% / 2 - 4px); margin: 0 2px 5px;}
.insta_wrap h2{font-size: 1.8em;}
.insta_wrap h2 i{display: block;font-size: 2em;margin: 0;}
.insta_btn_wrap{margin: 2em auto 2em;width: 90%;}
.insta_btn_wrap a{font-size: 1.3em;padding: 0.5em 0 0.3em;}
.map_wrap{height: 350px;}
.shop_detail{padding-top: 1em;}
.shop_detail p{font-size: 1.1em;}
}

/*神戸牛 -----------------------------------------------------------------*/
.kb_header_wrap{
background-color: #000;
background-image: url(../img/header_img_kobe-beef.jpg);
background-repeat: no-repeat;
background-position: right bottom;
/*background-size: cover;*/
}
.kb_header{
width: 1100px;
height: 580px;
margin: 0 auto;
position: relative;
}
.logo_kobe-beef,.logo_kobe-beef_gi,.kb_header_co,.mark_A5{position: absolute;}
.logo_kobe-beef{left: 0;top: 30px;}
.logo_kobe-beef_gi{right: 0;top: 30px;width: 270px;}
.mark_A5{top: 30px;right: 280px;width: 135px;}
.kb_header_co{
color: #fff;
width: 700px;
bottom: 2em;
left: 2em;
}
.kb_header_dl{display: flex;margin-bottom: 1em;}
.kb_header_dl dt{
font-weight: bold;
font-size: 1.7em;
width: 150px;
background: #c10034;
text-align: center;
padding: 0.6em 0 0;
}
.kb_header_dl dd{
width: calc(100% - 150px);
padding: 0px 1em;
}
.kb_header_co p{font-size: 1.1em;}
h2{font-size: 22px;}
.kb_h2_wrap{
background: #c10034;
padding: 0.5em;
color: #fff;
}
h2.kb_h2{
width: 1100px;
margin: 0 auto;
padding: 0 1.5em;
}
.info1,.info2{align-items: center;justify-content: space-between;}
.info1_img_wrap{
position: relative;
width: 48%;
height: 250px;
}
.meet_block,.meet_cut{
position: absolute;
border-radius: 50%;
border: solid 7px #fff;
}
.meet_block{
width: 310px;
top: -20px;
left: -20px;
}
.meet_cut{
width: 210px;
right: 30px;
bottom: -70px;
}
.info1_text{
width: 52%;
font-size: 1.1em;
}
.info1_text span{
background: linear-gradient(transparent 60%, #fcd893 60%);
font-weight: bold;
}
.info2_img_wrap{
order: 2;
width: 45%;
}
.info2_text{
order: 1;
width: 51%;
font-size: 1.1em;
}
.info2_text span,.info3_text span{
font-weight: bold;
display: block;
padding-top: 1em;
}
.info3{justify-content: space-between;margin-top: 3em;}
.info3_img_wrap{
width: 25%;
}
.info3_text_wrap{width: 71%;}
.info3_text_wrap h3{
background: #000;
padding: 0.5em 1em;
color: #fff;
margin-bottom: 0.5em;
}
.info3_text{font-size: 1.1em;}
.bronze_statue{display: none;}

/*ツアー -----------------------------------------------------------------*/
.tour_wrap{justify-content: space-between;}
.tour_co{
width: calc(100% / 3 - 0.5em);
background: #fff;
padding: 1em 1em 0.6em;
box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1);
margin: 0 0 2em;
}
.tour_co a{
display: flex;
flex-direction: column;
color: #4c4c4c;
}
.tour_co a:hover{text-decoration:none;}
.tour_img_wrap{
display: flex;
flex-wrap: wrap;
}
.tour_img_wrap img{width: 50%;}
.tour_img_wrap img.w100{width: 100%;}
.tour_type{
background-color: #f60;
color: #fff;
padding: 0.3em;
margin: 0.5em 0;
font-size: 12px;
width: 20% !important;
text-align: center;
}
.tour_title{
font-size: 16px;
font-weight: bold;
height: 3em;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
overflow: hidden;
margin-bottom: 1em;
}
.tour_price_wrap{
display: flex;
justify-content: space-between;
align-items: end;
margin: 0 0 1em 0em;
border-bottom: dotted 1px;
}
.tour_price_wrap p{font-size: 14px;width: unset;}
.tour_price{
color: #cc0000;
font-weight: bold;
font-size: 18px !important;
}
ul.tour_dep,ul.tour_month{
display: flex;
flex-wrap: wrap;
list-style: none;
padding: 0;
margin-bottom: 0.2em;
}
.tour_dep li,.tour_month li{
font-size: 12px;
margin-right: 0.5em;
margin-bottom: 0.3em;
}
.tour_dep li{
background: #ff574a;
padding: 0 1.4em;
border-radius: 5px;
color: #fff;
}
.tour_month li{
background-color: #ececec;
padding: 0 0.3em;
}
.tour_dep li:first-child,.tour_month li:first-child{
font-weight: bold;
padding: 0;
background: none;
color: #4c4c4c;
}
.btn_tour{
margin:1em auto 1em;
text-align: center;
width: 50%;
}
.btn_tour a{
font-size: 1.2em;
background: #c10034;
color: #fff;
font-weight: bold;
border-radius: 50px;
padding: 0.7em 0;
display: block;
}

@media screen and (max-width:768px){
.kb_header_wrap{
width: 100%;
background-size: 80%;
background-position: right 11em;
padding-bottom: 0.5em;
}
.kb_header{width: 97%;position: unset;height: auto;}
.logo_kobe-beef{position: unset;width: 96%;margin: 1em auto 0.5em;}
.logo_kobe-beef_gi{width: 40%;margin-right: 60%;position: unset;}
.mark_A5{position: unset;width: 20%;margin-top: 10px;}
.kb_header_co{position: unset;width: 96%;margin: 2em auto 0.5em;}
.kb_header_dl{flex-wrap: wrap;}
.kb_header_dl dt{
font-size: 20px;
padding: 0.3em 0.8em 0.1em;
display: block;
width: unset;
margin-bottom: 0.3em;
}
.kb_header_dl dd{width: 100%;padding: 0;}
.kb_header_co p{font-size: 1em;}
h2{font-size: 18px;}
.kb_h2_wrap{padding: 0.5em 0.5em 0.5em;}
h2.kb_h2{width: 98%;padding: 0;}
.info1,.info2{border: none;}
.info1_img_wrap{width: 350px;height: 260px;margin: 0 auto 1em;}
.meet_block,.meet_cut{border: none;}
.meet_block{width: 220px;top: 0;left: 0;}
.meet_cut{width: 180px;right: 0;bottom: 0;}
.info1_text{width: 100%;font-size: 1em;}
.info1_text span{}
.info2_img_wrap{order: 1;width: 100%;margin: 0em auto 1em;}
.info2_text{order: 2;width: 100%;font-size: 1em;}
.info3{margin-top: 1.5em;}
.info3_img_wrap{}
.info3_text_wrap{width: 100%;}
.info3_text_wrap h3{font-size: 18px;padding: 0.5em 0.5em;}
.info3_text{font-size: 1em;}
.bronze_statue{display: block;width: 60%;margin: 0 auto 1em;}

/*ツアー -----------------------------------------------------------------*/
.tour_wrap{}
.tour_co{width: calc(100% / 1 - 1em);margin: 0 0.5em 1.5em;}
.tour_co a{}
.tour_co a:hover{}
.tour_img_wrap{}
.tour_img_wrap img{}
.tour_img_wrap img.w100{}
.tour_type{}
.tour_title{}
.tour_price_wrap{}
.tour_price_wrap p{}
.tour_price{}
ul.tour_dep,ul.tour_month{}
.tour_dep li,.tour_month li{}
.tour_dep li{}
.tour_month li{}
.tour_dep li:first-child,.tour_month li:first-child{}
.btn_tour{width: 85%;}
.btn_tour a{font-size: 1.1em;padding: 1em 0;}

}

