@charset "utf-8";

/* header block
---------------------- */
#headerWrapper	{
    width: 100%;
    height: 113px;
    /*border-bottom: 1px solid #dcdddd;*/
    position: relative;
    background-color: #ffffff;
    z-index: 10;
    /*position: fixed;*/
}


/* english site
---------------------- */
.englishBtn {
    text-indent: -9999px;
    height: 30px;
    padding: 5px 5px 0 0;
}

.englishBtn a {
    background-image: url(../images/btn_english_off.jpg);
    width: 79px;
    height: 20px;
    display: block;
}

.englishBtn a:hover {
    background-image: url(../images/btn_english_on.jpg);
}



/* search box
---------------------- */
.headerSearchBox    {
    height: 30px;
    border-bottom: 1px solid #dcdddd;
    position: relative;
}

.headerSubBox   {
    position: absolute;
    top: 0px;
    right: 0px;
}

.styleSwitcher  {
    /*margin: 0 0 0 523px;*/
    display: inline;
}

.styleSwitcher ul  {
    margin: 0px;
    padding: 0px;
    height: 30px;
    width: 93px;
    display: inline;
}

.styleSwitcher ul li  {
    float: left;
    width: 30px;
    height: 30px;
    text-align: center;
    list-style-type: none;
    border-left: 1px solid #dcdddd;
    line-height: 30px;
}

.styleSwitcher ul li a  {
    width: 30px;
    height: 30px;
    display: block;
    color: #231815;
    font-weight: bold;
}

.styleSwitcher ul li a:hover  {
    color: #ffffff;
    background-color: #231815;
}

.searchBox  {
    width: auto;
    display: inline;
}

.searchBox input#submitBtn   {
    border: none;
    cursor: pointer;
    background-color: #231815;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    width: 62px;
}

.searchBox input#srchInput   {
    width: 277px;
    height: 22px;
    margin: 0 7px 0 0;
    padding: 4px 6px 4px 6px;
    border: none;
    font-size: 14px;
    background-image: url(http://www.google.com/cse/static/ja/google_custom_search_watermark.gif);
    background-position: left center;
    background-repeat: no-repeat;
}

.searchBox input#srchInput:focus   {
    background-image: none!important;
}
    
.facebookBtn    {
    text-indent: -9999px;
    width: 31px;
    height: 31px;
    overflow: hidden;
    float: right;
}

.facebookBtn a  {
    background-image: url(../images/headerFB.jpg);
    background-repeat: no-repeat;
    width: 31px;
    height: 31px;
    display: block;
}
.facebookBtn    {
    text-indent: -9999px;
    width: 31px;
    height: 31px;
    overflow: hidden;
    float: right;
}






/* logo & navigation box
---------------------- */
.headerLogoBox h1   {
    width: 284px;
    height: 81px;
    border-right: 1px solid #dcdddd;
    background-image: url(../images/logo.png);
    background-repeat: no-repeat;
    text-indent: -9999px;
    float: left;
    box-sizing: border-box;
}

.headerLogoBox h1 a   {
    display: block;
    width: 284px;
    height: 81px;
}



#headerWrapper #nav
{
    float: right;
    /*background-color: #dddddd;*/
    width: 716px\0;
    width: 716px\9;
}

.clearfix::after
{
	content: '';
	display: table;
	clear: both;
}

#nav li ul  {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

#nav li ul li {
    border: none;
}

#nav a.headerPMSP
{
	display: none;
}

/* navigation PC style */
@media only screen and ( min-width: 768px ) 
{
#nav li.gNaviEvent a.gNaviEventHover    {
	background: url(../images/gNaviEvent_off.png) center top no-repeat;
	width: 119px;
	height: 78px;
	border-bottom: 4px solid #fc5d80;
	text-indent: -9999px;
	display: block;
}

#nav li.gNaviEvent a.gNaviEventHover:hover    {
	background: url(../images/gNaviEvent_on.png) center top no-repeat;
	background-color: #fc5d80;
}

#nav li.gNaviPlace a.gNaviPlaceHover    {
	background: url(../images/gNaviPlace_off.png) center top no-repeat;
	width: 119px;
	height: 78px;
	border-bottom: 4px solid #17a4c6;
	text-indent: -9999px;
	display: block;
}

#nav li.gNaviPlace a.gNaviPlaceHover:hover    {
	background: url(../images/gNaviPlace_on.png) center top no-repeat;
	background-color: #9ed0e5;
}

#nav li.gNaviWalking a.gNaviWalkingHover    {
	background: url(../images/gNaviWalking_off.png) center top no-repeat;
	width: 118px;
	height: 78px;
	border-bottom: 4px solid #00c697;
	text-indent: -9999px;
	display: block;
}

#nav li.gNaviWalking a.gNaviWalkingHover:hover    {
	background: url(../images/gNaviWalking_on.png) center top no-repeat;
	background-color: #00c697;
}

#nav li.gNaviGourmet a.gNaviGourmetHover    {
	background: url(../images/gNaviGourmet_off.png) center top no-repeat;
	width: 118px;
	height: 78px;
	border-bottom: 4px solid #be8573;
	text-indent: -9999px;
	display: block;
}

#nav li.gNaviGourmet a.gNaviGourmetHover:hover    {
	background: url(../images/gNaviGourmet_on.png) center top no-repeat;
	background-color: #be8573;
}

#nav li.gNaviSpecial a.gNaviSpecialHover    {
	background: url(../images/gNaviSpecial_off.png) center top no-repeat;
	width: 118px;
	height: 78px;
	border-bottom: 4px solid #ff9f35;
	text-indent: -9999px;
	display: block;
}

#nav li.gNaviSpecial a.gNaviSpecialHover:hover    {
	background: url(../images/gNaviSpecial_on.png) center top no-repeat;
	background-color: #ff9f35;
}

#nav li.gNaviAccess a.gNaviAccessHover    {
	background: url(../images/gNaviAccess_off.png) center top no-repeat;
	width: 118px;
	height: 78px;
	border-bottom: 4px solid #1b2b5f;
	text-indent: -9999px;
	display: block;
}

#nav li.gNaviAccess a.gNaviAccessHover:hover    {
	background: url(../images/gNaviAccess_on.png) center top no-repeat;
	background-color: #1b2b5f;
}


#nav ul li ul.menu01   {
    width: 715px;
    position: absolute;
    background-color: #fc5d80;
}
#nav ul li ul.menu02   {
    width: 715px;
    position: absolute;
    margin-left: -119px;
    background-color: #9ed0e5;
}
#nav ul li ul.menu03   {
    width: 715px;
    position: absolute;
    margin-left: -239px;
    background-color: #00c697;
}
#nav ul li ul.menu04   {
    width: 715px;
    position: absolute;
    margin-left: -358px;
    background-color: #be8573;
}
#nav ul li ul.menu05   {
    width: 715px;
    position: absolute;
    margin-left: -477px;
    background-color: #ff9f35;
}
#nav ul li ul.menu06   {
    width: 715px;
    position: absolute;
    margin-left: -596px;
    background-color: #1b2b5f;
}

.pulldownInner  {
    padding: 20px;
    position: relative;
    width: 100%;
}

#nav .pulldownInner a.normalTxtLink   {
    background-color: none !important;
    background-image: none!important;
    text-align: left;
    color: #333333;
}

#nav .pulldownInner .headerPMAccess a    {
    background-color: #ffffff;
    color: #333333;
    margin: 0 0 10px 0;
    font-size: small;
    padding: 10px 10px 7px 10px; 
    display: block;
}

#nav .pulldownInner .headerPMPlace a    {
    background-color: #18a3c5;
    color: #ffffff;
    margin: 0 0 5px 0;
    font-size: small;
    padding: 7px 15px 4px 15px; 
    display: block;
}

/* 仮BOX定義 PM  */
#nav .pulldownInner .headerPMWaking01    {
    /* background-color: #ffffff; */
    background-color: #00c697;
    width: 330px;
    height: 170px;
    position: relative;
    text-align: center;
}

#nav .pulldownInner .headerPMWaking02    {
    /* background-color: #ffffff; */
    background-color: #00c697;
    width: 330px;
    height: 75px;
    position: relative;
    text-align: center;
}

#nav .pulldownInner .headerPMWaking03    {
    /* background-color: #ffffff; */
    background-color: #00c697;
    width: 155px;
    height: 75px;
    position: relative;
    text-align: center;
}

#nav .pulldownInner .headerPMGourmet01    {
    /* background-color: #ffffff; */
    background-color: #be8573;
    width: 210px;
    height: 160px;
    position: relative;
    text-align: center;
}

#nav .pulldownInner .headerPMSpecial01    {
    background-color: #ff9f35;
    width: 155px;
    height: 70px;
    position: relative;
    text-align: center;
}

#nav .pulldownInner .headerPMSpecial02    {
    background-color: #ff9f35;
    width: 155px;
    height: 30px;
    position: relative;
    text-align: center;
}

                   
/* navigation PC basic style */
#nav ul li
{
	position: relative;
	border-right: 1px solid #dcdddd;
	float: left;
	display: block;
}

/*#nav li a
{
	color: #fff;
	display: block;
}*/

#nav li a:active
{
	/*background-color: #c00 !important;*/
}

#nav span:after
{
	content: '';
	vertical-align: middle;
	/*display: inline-block;*/
	position: relative;
}

/* first level */

#nav ul
{
				
}

#nav ul li
{
	/*width: 25%;*/
	height: 100%;
	float: left;
}

#nav ul li a
{
	/*text-align: center;*/
}

#nav ul li:not( :last-child ) a
{
							
}

/* gNavi hover style */
#nav ul li.gNaviEvent:hover a.gNaviEventHover
{
	background-color: #fc5d80;/* keep hover color */
	background-image: url(../images/gNaviEvent_on.png);
}
#nav ul li.gNaviPlace:hover a.gNaviPlaceHover
{
	background-color: #17a4c6;/* keep hover color */
	background-image: url(../images/gNaviPlace_on.png);
}
#nav ul li.gNaviWalking:hover a.gNaviWalkingHover
{
	background-color: #00c697;/* keep hover color */
	background-image: url(../images/gNaviWalking_on.png);
}
#nav ul li.gNaviGourmet:hover a.gNaviGourmetHover
{
	background-color: #be8573;/* keep hover color */
	background-image: url(../images/gNaviGourmet_on.png);
}
#nav ul li.gNaviSpecial:hover a.gNaviSpecialHover
{
	background-color: #ff9f35;/* keep hover color */
	background-image: url(../images/gNaviSpecial_on.png);
}
#nav ul li.gNaviAccess:hover a.gNaviAccessHover
{
	background-color: #1b2b5f;/* keep hover color */
	background-image: url(../images/gNaviAccess_on.png);
}

/* access pulldown style */
.pulldownInnerAccess    {
    padding: 15px 10px 0 10px;
    position: relative;
}

.gNaviAccess .accessChara   {
    background-image: url(../images/headerPMaccessChara.png);
    background-repeat: no-repeat;
    width: 108px;
    height: 64px;
    text-indent: -9999px;
    position: absolute;
    left: 10px;
    bottom: 0px;
}

.gNaviAccess .accessBtnBase {
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    overflow: hidden;
    border: 1px solid #ffffff;
    text-indent: -9999px;
}

.gNaviAccess .accessBtnBase a {
    display: block;
    width: 80px;
    height: 80px;
}

.gNaviAccess .accessBtnBase a:hover {
    background-color: #ffffff;
}

.gNaviAccess .accessMap   {
    background-image: url(../images/headerPMaccess01_off.png);
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
    margin-left: 202px;
}

.gNaviAccess .accessMap a:hover   {
    background-image: url(../images/headerPMaccess01_on.png);
}

.gNaviAccess .accessExp   {
    background-image: url(../images/headerPMaccess02_off.png);
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
}

.gNaviAccess .accessExp a:hover   {
    background-image: url(../images/headerPMaccess02_on.png);
}

.gNaviAccess .accessTrain   {
    background-image: url(../images/headerPMaccess03_off.png);
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
}

.gNaviAccess .accessTrain a:hover   {
    background-image: url(../images/headerPMaccess03_on.png);
}

.gNaviAccess .accessCar   {
    background-image: url(../images/headerPMaccess04_off.png);
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
}

.gNaviAccess .accessCar a:hover   {
    background-image: url(../images/headerPMaccess04_on.png);
}

.gNaviAccess .accessShip   {
    background-image: url(../images/headerPMaccess05_off.png);
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
}

.gNaviAccess .accessShip a:hover   {
    background-image: url(../images/headerPMaccess05_on.png);
}

.gNaviAccess .accessAir   {
    background-image: url(../images/headerPMaccess06_off.png);
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
}

.gNaviAccess .accessAir a:hover   {
    background-image: url(../images/headerPMaccess06_on.png);
}



				/* second level */

				#nav li ul
				{
					/*background-color: #cc470d;*/
					display: none;
					position: absolute;
					top: 100%;
				}
					#nav li:hover ul
					{
						display: block;
						left: 0;
						right: 0;
					}
						#nav li:not( :first-child ):hover ul
						{
							left: -1px;
						}
						#nav li ul a
						{
							
						}
							#nav li ul li a:hover,
							#nav li ul:not( :hover ) li.active a
							{
								/*background-color: #e15a1f;*/
							}

/* sns */
.headerSNS  {
    position: absolute;
    top: 0px;
    right: 0px;
}
.headerSNS .fbBtn ,
.headerSNS .twBtn ,
.headerSNS .inBtn  {
    width: 30px;
    height: 30px;
    float: left;
}
.headerSNS a {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    display: block;
    text-indent: -9999px;
}
.headerSNS .fbBtn a  {
    background-image: url(../images/headerFB-new.svg);
    width: 30px;
    height: 30px;
}
.headerSNS .twBtn a  {
    background-image: url(../images/headerTw-new.svg);
    width: 30px;
    height: 30px;
}
.headerSNS .inBtn a  {
    background-image: url(../images/headerIn-new.svg);
    width: 30px;
    height: 30px;
}

.footerSNS  {
    margin-left: auto;
    width: 135px;
    margin-top: 10px;
}
.footerSNS .fbBtn ,
.footerSNS .twBtn ,
.footerSNS .inBtn  {
    width: 45px;
    height: 45px;
    float: left;
}
.footerSNS a {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    display: block;
    text-indent: -9999px;
}
.footerSNS .fbBtn a  {
    background-image: url(../images/headerFB-new.svg);
    width: 45px;
    height: 45px;
}
.footerSNS .twBtn a  {
    background-image: url(../images/headerTw-new.svg);
    width: 45px;
    height: 45px;
}
.footerSNS .inBtn a  {
    background-image: url(../images/headerIn-new.svg);
    width: 45px;
    height: 45px;
}



}

@media only screen and ( max-width: 768px )
{
            /* header */
            .headerLogoBox h1   {
            width: 200px;
            border-right: none;
            background-image: url(../images/sp/logo.png);
            background-repeat: no-repeat;
            background-position: left center;
            background-size: contain;
            text-indent: -9999px;
            float: left;
            height: auto;
            padding: 20px 0 0 0;
            margin-left: 10px;
            }
            
            .headerLogoBox h1 a   {
            display: block;
            width: 200px;
            height: auto;
            }
            
            #headerWrapper	{
            width: 100%;
            height: 114px;
            border-bottom: 1px solid #dcdddd;
            position: relative;
            z-index: 10;
            /*position: fixed;*/
            }
            


            .pulldownInner  {
            display: none;
            }

            .headerSearchBox    {
            /*display: none;*/
            display: block;
            position: absolute;
            top: 74px;
            /*border-top: 1px solid #dcdcdc;*/
            width: 100%;
            border: none !important;
            }
            .container  {
            width: 100%;
            margin: 0 auto;
            }

			#nav
			{
				width: 100%;
				margin: 0;
				position: absolute;
				top: 0px;
			}

			html
			{
				font-size: 100%; /* 12 */
			}

			#nav
			{
				top: auto;
				left: auto;
			}
				#nav a.headerPMSP
				{
					width: 40px; /* 50 */
					height: 40px; /* 50 */
					text-align: left;
					background-color: #ffffff;
					position: absolute;
					text-indent: -3em;
					font-family: "HelveticaNeue-CondensedBold";
					top: 15px;
					right: 10px;
				}
				#nav a.headerPMSP .panel-btn-icon
				{
    				    display: block;
                    position: absolute;
                    top: 50%;
                    height: 4px;
                    width: 100%;
                    background: #595757;
                    text-indent: -9999px;
    				}
    				#nav a.headerPMSP span.panel-name
				{
    				    position: absolute;
                    top: 100%;
                    display: none;
    				}
					#nav a.headerPMSP  .panel-btn-icon:before,
					#nav a.headerPMSP  .panel-btn-icon:after
					{
						display: block;
                        content: '';
                        position: absolute;
                        top: 50%;
                        width: 100%;
                        height: 4px;
                        background: #595757;
					}
					#nav a.headerPMSP .panel-btn-icon:after
					{
						margin-top: -14px;
					}
					#nav a.headerPMSP .panel-btn-icon:before
					{
						margin-top: 10px;
					}
					

				#nav:not( :target ) a:first-of-type,
				#nav:target a:last-of-type
				{
					display: block;
				}


			/* first level */

			#nav ul
			{
				height: auto;
				display: none;
				position: absolute;
				top: 74px;
				width: 100%;
				background-color: #ffffff;
				border-top: 1px solid #cccccc;
				box-sizing: border-box;
			}
			#nav ul li
			{
				width: 33.333%;
				float: left;
				padding: 0;
				margin: 0px;
				border-right: 1px solid #cccccc;
				border-bottom: 1px solid #cccccc;
				box-sizing: border-box;
			}
			#nav ul li:nth-child(3n)    {
    			    border-right: none;
			}
			{
				width: 33.333%;
				float: left;
				padding: 0px;
				margin: 0px;
				border-right: 1px solid #cccccc;
				border-bottom: 1px solid #cccccc;
				box-sizing: border-box;
			}
				#nav:target ul
				{
					display: block;
				}

                #nav ul li.gNaviEvent a    {
                background: url(../images/gNaviEvent_off.png) center top no-repeat;
                width: 100%;
                height: 78px;
                text-indent: -9999px;
                display: block;
                }
                #nav ul li.gNaviEvent a:hover    {
                background: url(../images/gNaviEvent_on.png) center top no-repeat;
                background-color: #FB5E81;
                }
                #nav ul li.gNaviPlace a    {
                background: url(../images/gNaviPlace_off.png) center top no-repeat;
                width: 100%;
                height: 78px;
                text-indent: -9999px;
                display: block;
                }
                #nav ul li.gNaviPlace a:hover    {
                background: url(../images/gNaviPlace_on.png) center top no-repeat;
                background-color: #18A3C5;
                }
                #nav ul li.gNaviWalking a    {
                background: url(../images/gNaviWalking_off.png) center top no-repeat;
                width: 100%;
                height: 78px;
                text-indent: -9999px;
                display: block;
                }
                #nav ul li.gNaviWalking a:hover    {
                background: url(../images/gNaviWalking_on.png) center top no-repeat;
                background-color: #00C698;
                }
                #nav ul li.gNaviGourmet a    {
                background: url(../images/gNaviGourmet_off.png) center top no-repeat;
                width: 100%;
                height: 78px;
                text-indent: -9999px;
                display: block;
                }
                #nav ul li.gNaviGourmet a:hover    {
                background: url(../images/gNaviGourmet_on.png) center top no-repeat;
                background-color: #BE8674;
                }
                #nav ul li.gNaviSpecial a    {
                background: url(../images/gNaviSpecial_off.png) center top no-repeat;
                width: 100%;
                height: 78px;
                text-indent: -9999px;
                display: block;
                }
                #nav ul li.gNaviSpecial a:hover    {
                background: url(../images/gNaviSpecial_on.png) center top no-repeat;
                background-color: #FFA037;
                }
                #nav ul li.gNaviAccess a    {
                background: url(../images/gNaviAccess_off.png) center top no-repeat;
                width: 100%;
                height: 78px;
                text-indent: -9999px;
                display: block;
                }
                #nav ul li.gNaviAccess a:hover    {
                background: url(../images/gNaviAccess_on.png) center top no-repeat;
                background-color: #1b2b5f;
                }


				/* second level */
				#nav li ul
				{
					position: static;
					padding: 1.25em; /* 20 */
					padding-top: 0;
					display: none!important;
				}
				
				/* 2015.12 add */
				.headerSubBox .styleSwitcher , .headerSubBox .facebookBtn   {
    				display: none;
				}
				#headerWrapper .headerSubBox .englishBtn {
    				position: absolute;
                top: -50px;
                left: 220px;
				}
				.headerSubBox   {
                position: relative!important;
                margin: 0;
                }
                .searchBox input#srchInput  {
                    width: 70%!important;
                    margin: 0 5px 0 0;
                    border: 1px solid #dddddd;
                    border-radius: 15px;
                    -webkit-border-radius: 15px;
                    -moz-border-radius: 15px;
                }
                .searchBox input#submitBtn  {
                    width: 20%!important;
                    margin: 0 5px 0 5px;
                    float: left;
                }
                
                
/* sns */
.headerSNS  {
    display: none;
}                
.footerSNS  {
    margin: 10px auto 0 auto;
    width: 135px;
}
.footerSNS .fbBtn ,
.footerSNS .twBtn ,
.footerSNS .inBtn  {
    width: 45px;
    height: 45px;
    float: left;
}
.footerSNS a {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    display: block;
    text-indent: -9999px;
}
.footerSNS .fbBtn a  {
    background-image: url(../images/headerFB-new.svg);
    width: 45px;
    height: 45px;
}
.footerSNS .twBtn a  {
    background-image: url(../images/headerTw-new.svg);
    width: 45px;
    height: 45px;
}
.footerSNS .inBtn a  {
    background-image: url(../images/headerIn-new.svg);
    width: 45px;
    height: 45px;
}

}
