/* スライダー ------------------------------------------*/
/* TOPスライダー */
.top_header{
width: 100%;
margin: 0 auto;
height: 40vw;
}
.swiper{
/*width: 1000px;*/
width: 100%;
height: 40vw;
}
.swiper-wrapper {  /* wrapperのサイズを調整 */
width: 100%;
height: 40vw;
}
.swiper-slide {/* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
height: 40vw;
background-color: #000;
position: relative;
}
.top_header_img{
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 40vw;
}
.top_header_img img{
width: 100%;
position: absolute;
transform: translate(-50%, -50%);
opacity: 0.8;
} 
.swiper-slide img.slide_uae{top: 50%; left: 50%;}
.swiper-slide img.slide_golf{top: 50%; left: 50%;}
.swiper-slide img.slide_desert{top: 50%; left: 50%;}
.swiper-slide img.slide_uae2{top: 50%; left: 50%;}
.swiper-slide img.slide_cappadocia{top: 50%; left: 50%;}
.swiper-slide img.slide_pyramid{top: 50%; left: 50%;}
.swiper-slide img.slide_giraffe{top: 56%; left: 50%;}
.swiper-slide img.slide_leopard{top: 50%; left: 50%;}
.swiper-slide img.slide_zebra{top: 50%; left: 50%;}

.top_header_text {
position: absolute;
top: 50%;
left: 50%;
z-index: 1;
transform: translate(-50%, -50%);
width: 850px;
padding: 1em;
text-align: center;
/*
background: rgba(255, 19, 19, 0.4);
border-radius: 130px;
*/
}
.top_header_text h1{
font-size: 2.2em;
color: #fff;
text-align: center;
/*text-shadow: #c40101 0px 4px 0px,#175b25 0px -2px 0px;*/
}
.top_header_text p{
font-size: 1.6em;
text-align: center;
color: #fff;
}
.top_header_text img{margin: 1em 0 1.5em;}

.top_img_bg{
position: absolute;
bottom: -1px;
width: 110%;
z-index: 1;
}
.top_img_bg img {
position: unset;
transform: translate(-5%, 0%);
}

@media screen and (max-width:768px){
.top_header{height: 500px;}
.swiper{height: 500px;}
.swiper-wrapper {height: 500px;}
.swiper-slide {height: 500px;}
.top_header_img{height: 500px;}
.top_header_img img{max-width: unset;width: auto;} 

.swiper-slide img.slide_uae{}
.swiper-slide img.slide_golf{left: 70%;}
.swiper-slide img.slide_desert{}
.swiper-slide img.slide_uae2{}
.swiper-slide img.slide_cappadocia{left: 115%;}
.swiper-slide img.slide_pyramid{top: 50%;}
.swiper-slide img.slide_giraffe{top: 50%;left: 78%;}
.swiper-slide img.slide_leopard{left: 100%;}
.swiper-slide img.slide_zebra{}

.top_header_text {width: 96%;top: 45%;}
.top_header_text h1{font-size: 1.5em;}
.top_header_text p{font-size: 1.2em;}
.top_header_text img{width: 85%;}
.top_img_bg{bottom: -2px;}
}


/*Aamaniについて ------------------------------------------*/
.about_amani{
text-align: center;
padding: 2.5em 0 3em;
background-image: url(../img/about_amani_bg.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
overflow: hidden;
background-color: rgba(255,255,255,0.1);
background-blend-mode: lighten;
color: #fff;
}
a.amani_link{
color: #926f05;
background: #fff;
border: solid 3px;
padding: 0.3em 1.0em;
}

@media screen and (max-width:768px){
.about_amani{padding: 2em 0 2.5em;}
a.amani_link{font-size: 1.1em;}
}

/*エリアから探す ------------------------------------------*/
.top_area{margin: 2.5em 0 2.5em;}
.top_area_ttl{
font-size: 1.2em;
font-weight: bold;
margin: 1em 0 0.5em;
border-left: 10px solid rgb(146, 111, 5);
padding-left: 0.4em;
line-height: 1.3;
}
.area_co{
width: calc(100% / 2 - 2em);
margin: 0.5em 1em 1em;
}
.area_co a{
position: relative;
width: 100%;
/*height: 125px;*/
height: 200px;
overflow: hidden;
display: block;
color: #000;
}
.area_co img{
position: absolute;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
width: 100%;
}
.area_co h3{
position: absolute;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
/*background: rgba(255, 255, 255, 0.8);*/
background: rgba(0, 0, 0, 0.5);
padding: 0.5em 0.5em;
width: 80%;
margin: 0;
font-size: 1.3em;
color: #fff;
text-align: center;
}
.area_co p {padding: 0.5em 0 0;}
.area_img01{}
.area_img02{}
.area_img03{top: 43% !important;}
.area_img04{top: 65% !important;}


@media screen and (max-width:768px){
.top_area{margin: 2.5em 0 2em;}
.top_area .co_flex{justify-content: space-between;}
.area_co{width: 100%;margin: 0 0 1.5em;}
.area_co a{height: 150px;}
.area_co img{}
.area_co h3{font-size: 1.1em;padding: 0.4em 0.3em;width: 90%;}
}

/*テーマから探す ------------------------------------------*/
.top_theme{padding: 2.5em 0 2.5em;}
.theme_co{
width: calc(100% / 3 - 1.4em);
margin: 0.5em 0.7em 1em;
}
.theme_co a{
position: relative;
width: 100%;
height: 200px;
overflow: hidden;
display: block;
}
.theme_co img{
position: absolute;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
width: 100%;
}
.theme_co a::after {
font-family: "Font Awesome 5 Free";
position: absolute;
color: #fff;
content: "\f054";
font-weight: bold;
right: 0.5em;
bottom: 0.5em;
}
.theme_img01{}
.theme_img02{top: 46% !important;}
.theme_img03{top: 46% !important;}
.theme_img04{}
.theme_img05{top: 45% !important;}
.theme_img06{top: 50% !important;}

.theme_co h3{
position: absolute;
font-size: 1.1em;
color: #fff;
font-weight: bold;
text-shadow: 0px 0px 6px #000;
background: rgba(0, 0, 0, 0.5);
width: 100%;
bottom: 0;
margin: 0;
padding: 0.2em 0.5em;
}
.theme_co p{padding: 0.5em 0 0;}

@media screen and (max-width:768px){
.top_theme{padding: 2em 0 0.5em;}
.theme_co{width: 100%;margin: 0 0 1.5em;}
.theme_co a{height: 150px;}
.theme_img01{}
.theme_img02{top: 20% !important;}
.theme_img03{}
.theme_img04{}
.theme_img05{}
.theme_img06{}
.theme_co h3{font-size: 1.1em;}
}

/*特集 ------------------------------------------*/
.top_special{
/*margin-bottom: 2.5em;*/
padding: 2em 0 1.5em;
}
.special_co{
width: calc(100% / 4 - 1em);
margin: 0 0.5em 1em;
background: #fff;
padding: 0;
border-bottom: none;
/*box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.1);*/
}
.special_co a{
display: flex;
flex-wrap: wrap;
text-decoration: none;
color: #000;
}
.top_special .special_co img{width: 100%;margin: 0;}
.top_special .special_co h3{font-size: 1.1em;margin: 0.5em 8px 0.3em;}
.top_special .special_co h3 span{letter-spacing: -3px;}
.top_special .special_text{
text-align: justify;
line-height: 1.5;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
margin: 0 8px;
}
.top_special .special_btn{
border: solid 1px;
text-align: center;
margin: 1em 2em 15px;
font-size: 0.9em;
}
.special_btn.qatar{color: #64003e;}
.special_btn.emirates{color: #d71921;}
.special_btn.garuda{color: #008c9a;}
.special_btn.turkish{color: #c90019;}

@media screen and (max-width:768px){
.top_special{margin: 0em 0 0em;padding: 2em 0 0.5em;}
.special_co{width: 100%;margin: 0 0.5em 2em;}
.special_co h3{font-size: 1.1em;}
.top_special .special_text{text-align: unset;}
}

/*ピックアップ ------------------------------------------*/
.top_pickup{padding: 2em 0 2.5em;}
.top_pickup .co_flex{justify-content: space-between;}

.frame_box {
position: relative;
width: 70%;
height: auto;
margin: 0 auto 3em;
background: url('../img/frame_01.png') left top no-repeat;
background-size: 130px auto;
padding: 2em 0;
}
.frame_box::after {
content: "";
position: absolute;
/* ↓ここで画像サイズを自由に変更 ↓ */
width: 130px;    /* 横サイズ */
height: 130px;   /* 縦サイズ */
right: 0;
bottom: 0;
background: url('../img/frame_01.png') no-repeat;
background-size: contain;  /* または 100% 100% や cover なども可 */
transform: rotate(180deg);
transform-origin: center;
pointer-events: none;
}
.pickup_list_lead{text-align: center;font-size: 1.1em;}
.top_pickup .tour_list_co{width: 49%;margin: 0 0em 2em;}
.top_pickup .tour_list_co a{
justify-content: space-between;
align-items: flex-start;
padding: 30px 8px 8px;
}
.top_pickup .tour_list_code_wrap{
width: 100%;
display: flex;
position: absolute;
top: 0;
left: 0;
}
.top_pickup .tour_list_code{}
.top_pickup .tour_list_plan,
.top_pickup .tour_list_guide{width: calc(100% - 350px) !important;}
.top_pickup .tour_list_img{width: 40%;margin: 0;}
.top_pickup .tour_list_text{width: 57%;margin: 0;}
.top_pickup .tour_list_title{
line-height: 1.5;
margin: 0 0 5px;
-webkit-line-clamp: 4;
}
.top_pickup .tour_list_title span{}
.top_pickup .tour_list_btn{
margin: 5px auto 0;
width: 100%;
}
.other_link{text-align: right;margin: 0em 0 1em;}
.other_link a{text-decoration: none;}
.other_link a::after {
content: "\f105";
font-family: "Font Awesome 5 Free";
margin: 0 5px 0 3px;
font-weight: 900;
}

@media screen and (max-width:768px){
.top_pickup .co_flex{}
.frame_box {
width: 100%;
padding: 1.5em 1.2em;
background-size: 90px auto;
margin: -0.5em auto 1.5em;
}
.frame_box::after {width: 90px;height: 90px;}
.pickup_list_lead{text-align: left;font-size: 1em;}
.top_pickup .tour_list_co{}
.top_pickup .tour_list_co a{padding: 0;}
.top_pickup .tour_list_code_wrap{position: unset;}
.top_pickup .tour_list_code{}
.top_pickup .tour_list_plan,.top_pickup .tour_list_guide{width: 100% !important;}
.top_pickup .tour_list_img{width: 100%;margin-bottom: 0.5em;}
.top_pickup .tour_list_text{width: 100%;margin: 0 5px;}
.top_pickup .tour_list_title{-webkit-line-clamp: 5;}
.top_pickup .tour_list_price{}
.top_pickup .tour_list_btn{margin: 5px 10px 10px;}
}

/* よくある質問　アコーディオン ----------------------------------------------------*/
.top_faq{padding: 2em 0 1.5em;margin-bottom: 2em;}
.ac_co summary {background: #fff;border-bottom: solid 1px #dcdcdc;}

@media screen and (max-width:768px){
.ac_co summary::before{left: 6px;top: 4px;}

}
