@charset "UTF-8";
/* CSS Document */

/*------------------------------------------------------------------*/
/* Header Style */
/*------------------------------------------------------------------*/
.menu-rec{
	position: relative;
	height: 87px;
	background-color: #000;
}

	
.mheader {
    position: absolute;
    text-align: center;
    top: 0px;
    z-index: 99;
    color: #fff;
    width: 1000px;
    height: 85px;
    transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
	background-color: #000;
}

@media all and (max-width: 1001px) {
	.menu-rec{
		background-image: url(/img/sstour/back-stripe-1.png);
	}
	.mheader {
		background-color: transparent;
		width: 100%;
	}
}
.mheader.header-prepare, .mheader.header-light.header-prepare {
	background-color: rgba(255, 255, 255, 0);
}
@media all and (min-width: 1025px) {
	.mheader.header-prepare, .mheader.header-light.header-prepare {
        background-color: rgba(0, 0, 0, 1);
		color: #fff;
	}
}

.mheader.header-dark.header-prepare {
	background-color: rgba(34, 34, 34, 0.95);
	border-bottom: 0px none;
}

.mheader.header-fixed {
	display: block;
	margin-top: 0 !important;
	position: fixed;
	height: 85px;
	
}
@media all and (min-width: 1025px) {
	.mheader.header-fixed {
		width: 1000px;
	}
}

.header-inner {
    /*padding-left: 30px;
    padding-right: 30px;*/
    position: relative;
}

.header-fixed .logo a {
    margin-top: 15px;
    margin-bottom: 15px;
    transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
}

.header-fixed .nav-menu ul.nav-menu-inner > li > a {
	padding: 5px 0px 5px 0px;
	cursor: pointer;
}

/*header Logo style*/
.mheader.header-prepare .logo a img.logo-light,
.mheader .logo a img.logo-dark {
    opacity: 0;
}

.mheader .logo a img.logo-light,
.mheader.header-prepare .logo a img.logo-dark,
.mheader.header-light .logo a img.logo-dark {
    opacity: 1;
}

.mheader.header-dark.header-prepare .logo a img.logo-dark,
.mheader.header-dark .logo a img.logo-dark {
    opacity: 0;
}

.mheader.header-dark.header-prepare .logo a img.logo-light,
.mheader.header-dark .logo a img.logo-light {
    opacity: 1;
}

@media all and (min-width: 1025px) {

    /*header nav style*/
    .mheader.header-prepare .nav-menu ul.nav-menu-inner > li > a {
        /*color: rgba(0,0,0,1);*/
    }

        .mheader.header-prepare .nav-menu ul.nav-menu-inner > li:hover > a,
        .mheader.header-prepare .nav-menu ul.nav-menu-inner > li > a:hover {
            /*color: rgba(34,34,34,1);*/
        }

    .mheader.header-dark.header-prepare .nav-menu ul.nav-menu-inner > li > a {
        color: rgba(255,255,255,0.75);
    }

        .mheader.header-dark.header-prepare .nav-menu ul.nav-menu-inner > li:hover > a,
        .mheader.header-dark.header-prepare .nav-menu ul.nav-menu-inner > li > a:hover {
            color: rgba(255,255,255,1);
        }
}

@media all and (max-width: 1000px) {
    .mheader {
        height: 79px;
    }

    .header-inner {
        /*padding-left: 30px;
        padding-right: 30px;*/
        position: relative;
        display: table;
        width: 100%;
    }

    .mheader .logo a {
		color: #fff;
        margin-top: 15px;
        margin-bottom: 15px;
        transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -webkit-transition: all 0.3s ease 0s;
    }
}

/*------------------------------------------------------------------*/
/* Navigation Menu Style */
/*------------------------------------------------------------------*/
.nav-menu {
    position: static;
    /*float: right;*/
    display: block;
}
.nav-menu.active {
	display: block;
}

.nav-menu ul.nav-menu-inner {
	margin: 0;
	padding: 0;
	list-style: none;
	cursor: pointer;
}

.nav-menu ul.nav-menu-inner li {
	display: inline-block;
	list-style: none;
	text-align: left;
}
.nav-menu ul.nav-menu-inner > li > a {
	/*color: rgba(255,255,255,0.60);*/
}

.header-light .nav-menu ul.nav-menu-inner > li > a {
    color: rgba(34, 34, 34, 0.6);
}




.nav-menu ul.nav-menu-inner li a {
    font-family: inherit;
    display: block;
    font-size: 15px;
    line-height: 1;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
}

.nav-menu ul.nav-menu-inner > li > a {
	padding: 2px 0px 4px 0px;
	    text-align: center;
}
.nav-menu ul.nav-menu-inner > li.li-off > a {
	padding: 2px 0px 4px 0px;
	    text-align: center;
}
.mheader .nav-menu ul.nav-menu-inner > li.active a,
.mheader .nav-menu ul.nav-menu-inner > li a.active,
/*.mheader .nav-menu ul.nav-menu-inner > li:hover > a,
.mheader .nav-menu ul.nav-menu-inner > li > a:hover,*/
.mheader.header-dark .nav-menu ul.nav-menu-inner > li.active a,
.mheader.header-dark .nav-menu ul.nav-menu-inner > li a.active,
.mheader.header-dark .nav-menu ul.nav-menu-inner > li:hover > a,
.mheader.header-dark .nav-menu ul.nav-menu-inner > li > a:hover,
.mheader.header-dark.header-prepare .nav-menu ul.nav-menu-inner li a.current,
.mheader.header-dark.header-prepare .nav-menu ul.nav-menu-inner li.current a {
    color: #fff;
}

.mheader.header-light .nav-menu ul.nav-menu-inner > li:hover > a,
.mheader.header-light .nav-menu ul.nav-menu-inner > li > a:hover,
.mheader.header-prepare .nav-menu ul.nav-menu-inner li a.current,
.mheader.header-prepare .nav-menu ul.nav-menu-inner li.current a {
    color: #222;
}

.area-title-asia,.area-title-beach{
	box-sizing: border-box;
	background-color: #f7578d;
	padding: 3px 10px;
}
.area-title-beach{
	background-color: #ee9911;
}
/* Mobile bar icon */
.nav-mobile.nav-bar-icon {
    display: none;
}

.nav-bar-icon {
    display: inline-block;
    float: right;
    position: relative;
	padding: 22px 35px 45px 25px;


    transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    cursor: pointer;
}

.header-fixed .nav-bar-icon {
    /*margin-top: 21px;
    margin-bottom: 21px;*/
}

.nav-bar-icon a {
    color: #fff;
    display: block;
    font-size: 17px;
    padding: 19px 0;
}

    .nav-bar-icon.active a, .nav-bar-icon a.active,
    .nav-bar-icon:hover a, .nav-bar-icon a:hover {
        color: #17a697;
    }

.nav-bar-icon > span {
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 2px;
	margin-left: 7px;
    margin-top: 10px;
    background-color: #222;
    -webkit-transition: -webkit-transform 0.3s, background 0.25s ease;
    -webkit-transition: background 0.25s ease, -webkit-transform 0.3s;
    transition: background 0.25s ease, -webkit-transform 0.3s;
    transition: transform 0.3s, background 0.25s ease;
    transition: transform 0.3s, background 0.25s ease, -webkit-transform 0.3s;
}

    .nav-bar-icon > span:before,
    .nav-bar-icon > span:after {
        content: "";
        position: absolute;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #222;
        -webkit-transition: -webkit-transform 0.3s, background 0.25s ease;
        -webkit-transition: background 0.25s ease, -webkit-transform 0.3s;
        transition: background 0.25s ease, -webkit-transform 0.3s;
        transition: transform 0.3s, background 0.25s ease;
        transition: transform 0.3s, background 0.25s ease, -webkit-transform 0.3s;
    }

.mheader .nav-bar-icon > span,
.mheader .nav-bar-icon > span:before,
.mheader .nav-bar-icon > span::after,
.mheader.header-dark .nav-bar-icon > span,
.mheader.header-dark .nav-bar-icon > span:before,
.mheader.header-dark .nav-bar-icon > span::after,
.mheader.header-dark.header-prepare .nav-bar-icon > span,
.mheader.header-dark.header-prepare .nav-bar-icon > span:before,
.mheader.header-dark.header-prepare .nav-bar-icon > span::after {
    background-color: #fff;
}

.mheader.header-light .nav-bar-icon > span,
.mheader.header-light .nav-bar-icon > span:before,
.mheader.header-light .nav-bar-icon > span::after,
.mheader.header-prepare .nav-bar-icon > span,
.mheader.header-prepare .nav-bar-icon > span:before,
.mheader.header-prepare .nav-bar-icon > span::after {
    /*background-color: #222;*/
}


.nav-bar-icon > span:before {
    -webkit-transform: translateY(-7px);
    transform: translateY(-7px);
    -o-transform: translateY(-7px);
    -ms-transform: translateY(-7px);
    -moz-transform: translateY(-7px);
}

.nav-bar-icon > span:after {
    -webkit-transform: translateY(7px);
    transform: translateY(7px);
    -o-transform: translateY(7px);
    -ms-transform: translateY(7px);
    -moz-transform: translateY(7px);
}

.nav-bar-icon.active span {
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

    .nav-bar-icon.active > span:before {
        transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
    }

    .nav-bar-icon.active > span:after {
        transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
    }

.nav-menu-inner  p:before {
    font-family: icomoon;
    content: "\1f358";
	padding-right: 4px;
    text-decoration: none;
}
.no_link{
	color: #666;
}

/* Dropdown-menu */
.nav-menu > ul li {
    position: relative;
}

.sub-dropdown.dropdown {
    top: 100%;
    left: 0;
}

.sub-dropdown {
    position: absolute;
    left: 100%;
    top: 0;
    display: none;
    background: rgba(34,34,34,0.90);
    padding: 0;
    width: 200px;
}

    .sub-dropdown li {
        width: 100%;
    }

    .sub-dropdown > li > a {
        padding: 13px 15px;
        display: block;
        color: rgba(255, 255, 255, 0.75);
    }

    .sub-dropdown > li:hover > a {
        background: rgba(255,255,255,0.05);
        color: #fff;
    }

    .sub-dropdown i {
        float: right;
    }


@media all and (max-width: 1000px) {
    .nav-menu ul.nav-menu-inner li {
        display: block;
        width: 100%;
    }

    .nav-menu {
        position: static;
        left: 0;
        top: 100%;
        float: none;
        display: none;
        width: 100%;
        background: rgba(34,34,34,0.85);
        overflow-y: auto;
        z-index: 999;
    }

    .nav-bar-icon, .nav-mobile.nav-bar-icon, .header-fixed .nav-bar-icon {
        display: inline-block;
        float: right;
		background-color: #000;
    }

    .nav-menu ul.nav-menu-inner li a, .header-fixed .nav-menu ul.nav-menu-inner li a {
            padding: 12px 12px;
    	border-top: 1px solid #666;
    }


    /* Dropdown */
    .sub-dropdown.dropdown, .sub-dropdown {
        top: 100%;
        position: relative;
        left: 0;
        width: 100%;
    }

        .sub-dropdown a {
            padding-left: 30px !important;
        }

    .mheader .nav-menu ul.nav-menu-inner li a.current,
    .mheader .nav-menu ul.nav-menu-inner li.current a,
    .mheader.header-light .nav-menu ul.nav-menu-inner > li:hover > a,
    .mheader.header-light .nav-menu ul.nav-menu-inner > li > a:hover,
    .mheader.header-prepare .nav-menu ul.nav-menu-inner li a.current,
    .mheader.header-prepare .nav-menu ul.nav-menu-inner li.current a {
        color: #fff;
    }
	
	.mheader.header-light .nav-menu ul.nav-menu-inner > li:hover > a.no_link{
		color: #666 !important;
	}
	.mheader.header-light .nav-menu ul.nav-menu-inner > li > a.no_link:hover{
		color: #666 !important;
	}

    .header-light .nav-menu ul.nav-menu-inner > li > a {
        color: rgba(255,255,255,0.60);
    }
}

/*********上書き*************/
@media all and (min-width: 1000px) {
	h3{
		/*margin-top: 90px;*/
	}
}
.mainImg_tourselection li a {
	display: block;
	font-size: 18px;
	font-weight: bold;
	margin-left: 9px;
	min-width: 70px;
	position: relative;
	text-decoration: none;
}
@media all and (max-width: 1000px) {
	.mainImg_tourselection li a{
		margin: 0px;
	}
}
.mainImg_tourselection li a:before {
	bottom: 15px;
	transform: rotate(0); 
}
.mainImg_tourselection li a:before{
	display: none;
}
.mainImg_tourselection li a:before {
	width: 100%%
}