@charset "utf-8";
/* CSS Document */

body{background-color: #121212;}

@font-face{
	font-family: 'typicons';
	src: url('../fonts/typicons.eot');
	src: url('../fonts/typicons.eot?#iefix') format('embedded-opentype'),
		url('../fonts/typicons.woff') format('woff'),
		url('../fonts/typicons.ttf') format('truetype'),
		url('../fonts/typicons.svg#typicons') format('svg');
	font-weight: normal;
	font-style: normal;
	}


img{max-width: 100%;}

	/*画像リンクの設定*/
	ul.slider li, p.longbanner, .Side p{background: #FFF;}
	ul.slider img:hover, p.longbanner img:hover, .Side img:hover{opacity: 0.75;}


p,dt,dd{color: #e3e3e3;}

main a,footer a{color: #9ad8ff !important;}
main a:hover,footer a:hover{color: #d9effd !important;}

:hover{
	transition: all 0.7s ease;
	-webkit-transition: all 0.7s ease;
	-moz-transition: all 0.7s ease;
	-ms-transition: all 0.7s ease;
	-o-transition: all 0.7s ease;
	}


/*--------------Navigation--------------*/
header{
	width: 280px;
	height: 100%;
	padding: 6% 10px;
	color: #FFF;
	background-color: #252525;
	top: 0;
	position: fixed;
	text-align: center;
	z-index: 9999;
	}

h1{margin: 0; padding: 0;}


ul#MENU{margin: 4.5em 0 3.5em;}

ul#MENU li{
	color: #c8a063;
	text-align: left;
	border-bottom: dotted 1px #c8a063;
	background-position: 10px 50%;
	background-repeat: no-repeat;
	}

	ul#MENU li:last-child{border-bottom: none;}
	ul#MENU li.Manual{opacity: 0.5;}

	.News{background: url(../images/dengo_ac_menu01.png);}
	.Event{background: url(../images/dengo_ac_menu08.png);}
	.NESiCA{background: url(../images/dengo_ac_menu07.png);}
	.Guide{background: url(../images/dengo_ac_menu02.png);}
	.GO_Meister{background: url(../images/dengo_ac_menu09.png);}
	.Manual{background: url(../images/dengo_ac_menu03.png);}
	.Location{background: url(../images/dengo_ac_menu04.png);}
	.Special{background: url(../images/dengo_ac_menu05.png);}
	.Mypage{background: url(../images/dengo_ac_menu06.png);}

	/*hover設定*/
	.News:hover{background: url(../images/dengo_ac_menu01on.png),#776344;}
	.Event:hover{background: url(../images/dengo_ac_menu08on.png),#776344;}
	.NESiCA:hover{background: url(../images/dengo_ac_menu07on.png),#776344;}
	.Guide:hover{background: url(../images/dengo_ac_menu02on.png),#776344;}
	.GO_Meister:hover{background: url(../images/dengo_ac_menu09on.png),#776344;;}
	/*.Manual:hover{background: url(../images/dengo_ac_menu03on.png),#776344;}*/
	.Location:hover{background: url(../images/dengo_ac_menu04on.png),#776344;}
	.Special:hover{background: url(../images/dengo_ac_menu05on.png),#776344;}
	.Mypage:hover{background: url(../images/dengo_ac_menu06on.png),#776344;}


	/*各カテゴリ設定*/
	#News li.News{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu01on.png);
		background-color: #776344;
		}

	#Event li.Event{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu08on.png);
		background-color: #776344;
		}

	#NESiCA li.NESiCA{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu07on.png);
		background-color: #776344;
		}

	#Guide li.Guide{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu02on.png);
		background-color: #776344;
		}

	#GO_Meister li.GO_Meister{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu09on.png);
		background-color: #776344;
		}

	/*#Manual li.Manual{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu03on.png);
		background-color: #776344;
		}*/

	#Location li.Location{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu04on.png);
		background-color: #776344;
		}

	#Special li.Special{
		color: #FFF;
		background-image: url(../images/dengo_ac_menu05on.png);
		background-color: #776344;
		}


ul#MENU a{
	width: 220px;
	padding: 1.5em 0 1.5em 60px;
	font-size: 1.1em;
	display: inline-block;
	}

	ul#MENU li a:hover{color: #FFF;}
	ul#MENU li.Manual a:hover{color: #c8a063;}


/*タブレット・スマホ用設定*/
#toggle{display: none;}



@media only screen and (max-height: 800px) {
	

	header{padding: 3.5% 10px;}
	ul#MENU{margin: 2.5em 0 1.5em;}
	ul#MENU li{background-size: 30px;}
	ul#MENU a{padding: 1em 0 1em 50px;}
	
}



/*--------------SNS--------------*/
	
ul.SNS {margin: auto; padding: 0;}
	
ul.SNS li{
	width:50px;
	height:50px;
	margin: 0 0.45em;
	display:inline-block;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	text-align: center;
	list-style-type:none;
	}
		
	.fb{border: solid 2px #3b579d;}
	.tw{border: solid 2px #55acee;}
	.ln{border: solid 2px #00cc00;}

	ul.SNS li:hover{background-color:rgba(255,255,255,0.1);}

	ul.SNS img{width: 60%; padding-top: 20%;}

/*MAIN用設定*/
section ul.SNS li{margin: 0 0.75em;}
section ul.SNS li:hover{background-color:rgba(255,255,255,0.15);}




/*--------------MAIN--------------*/
main{
	margin:0 0 0 300px;
	padding: 1.7em;
	display: block;
	z-index: 999;
	}

section:not(.machine_info){margin-top: 1.8em;}
main section:last-child{padding: 10% 0; text-align: center;}

.FlexBox{display: flex; flex-wrap: wrap;}


/*TOP_運行状況*/
.Status{
	font-weight: bold;
	border: solid 3px #656565;
	border-radius: 40px;
	}

.Status dl{
	margin: 0;
	border: solid 2px #fff8ec;
	border-radius: 40px;
	background: url(../images/dengo_ac_statusbg.png);
	display: flex;
	}

.Status dt{width: 15%; padding: 0.65em 2.5%;}
.Status dt p{
	padding-left: 28px;
	background: url(../images/dengo_ac_service01.png) no-repeat;
	}

.Status dd{
	width: 85%;
	margin: 0;
	padding-left: 20px;
	border-radius: 40px;
	background-color: rgba(123, 171, 79 ,0.5);
	}

.Status dd div{
	height: 100%;
	padding-left: 20px;
	border-radius: 40px;
	background-color: rgba(123, 171, 79 ,0.5);
	}

.Status dd p{
	height: 100%;
	color: #7BAB4F;
	padding: 0.65em 4.5%;
	border-radius: 40px;
	line-height: 1.4em;
	background-color: #FFF;
	}


	/*運行状況_重要度普*/
	.normal a{color: #7BAB4F!important;}
	.normal a:hover{color: #85d4ea!important;}

	/*運行状況_重要度高*/
	.high dd{background-color: rgba(255,0,4,0.4);}
	.high dd div{background-color: rgba(255,0,4,0.5);}
	.high dd p{color: #e60012;}
	.high dd a{color: #e60012 !important;}
	.high dd a:hover{color: #fc4352 !important;}



/*TOP_レイアウト*/
.topArticle_01{width: 53%; margin-right: 1%;}
.topArticle_02{width: 45%; margin-left: 1%;}


/*TOP_イベントバナー掲載エリア*/
.topArticle_02 ul{margin: 0; padding: 0;}

	/*イベントバナー掲載エリア_矢印位置*/
	.slick-next {right: 2px !important; z-index: 99;}
	.slick-prev {left: 2px !important; z-index: 100;}


/*TOP_新着情報*/
.topNews a{
	padding: 1em 0.75em;
	display: block;
	border-bottom: solid 1px #535353;
	}

	.topNews a:hover{background-color: #353535;}

dl.topNews{margin-top: 0 !important;}

.topNews dt{
	color: #96dcfd;
	line-height: 1.6em;
	font-weight: bold;
	margin-bottom: 1.0em;
	}

.topNews dd{font-size: 1.0em; margin: 0 !important;}

.topNews dd:before {
    content: "ニュース";
    color: #FFF;
    font-size: 0.8em;
    font-weight: bold;
    padding: 0.35em 20px;
    margin-right: 1.0em;
    background-color: #7BAB4F;
	}


/*TOP_ページ下部バナー*/
.banner{display: flex; flex-wrap: wrap;}
ul.banner {margin: 8% 0 0; padding: 0;}
.banner li{width: 23%; margin: 1%; list-style-type: none;}


/*TOP_製品情報*/
.machine_info{
	padding: 5em 10% 5em 35%;
	font-size: 0.9em;
	line-height: 1.2em;
	background: #1b1b1b;
	display: flex;
    flex-wrap: wrap;
	align-items: center;
	}

	.machine_info div{flex: 0 1 25%;}
	.machine_info p{text-align: right;}

	.machine_info ul{flex: 0 1 35%; list-style-type: none;}
	.machine_info li{
		margin-bottom: 1.0em;
		color: #e3e3e3;
		}
	.machine_info span{color: #7BAB4F;}


.machine_info p.LinkButton{
    max-width: 340px;
	padding: 0.5em;
	text-align: center;
	color: #7BAB4F;
	font-weight: bold;
	border: solid 2px #7BAB4F;
	}

	.machine_info p.LinkButton:hover{background: #7BAB4F; color: #FFF;}

/*20201124追加*/
@media only screen and (max-width: 1024px) {
    .machine_info div{flex: 0 1 35%;}
    .machine_info div:first-child{margin-left: 10%;}
    .machine_info ul{flex: 0 1 90%; margin: auto;}
    .machine_info p.LinkButton{max-width: 370px;}
    }

@media only screen and (max-width: 860px) {
    .machine_info{padding: 5em 10% 5em 10%;}
    .machine_info div{flex: 0 1 40%;}
    .machine_info div:first-child{margin-left: 8%;}
    .machine_info ul{flex: 0 1 75%; margin: auto;}
    }

@media only screen and (max-width: 480px) {
    .machine_info{padding: 5em 5% 5em 5%;}
    .machine_info div{flex: 0 1 45%;}
    .machine_info ul{flex: 0 1 85%; margin: auto; padding: 0!important;}
    }


/*共通_パンくずリスト*/
.pageList{width: 100%; display: block;}

.pageList ul{
	display: flex;
	padding: 0;
	margin-bottom: 0 !important;
	}

.pageList li{
	font-size: 0.9em;
	margin-right: 2.0em;
	color: #e3e3e3;
	list-style-type: none;
	}

	.pageList li:before{
		font-family: "typicons";
		content: '\e0b0';
		font-size: 0.9em;
		margin-right: 0.35em;
		}


/*共通_h2*/
h2{
	margin: 0 !important;
	padding: 0.25em 0.5em 0.15em;
	font-size: 1.2em;
	line-height: 1.8em;
	color: #FFF;
	/*box-shadow:0px 0px 4px 0px #5ec5e3 inset;
	-moz-box-shadow:0px 0px 4px 0px #5ec5e3 inset;
	-webkit-box-shadow:0px 0px 4px 0px #5ec5e3 inset;*/
	border-top: solid 8px #475f31;
	border-bottom: solid 8px #475f31;
	background-color: #7BAB4F;
	}

/*共通_h3*/
h3{
	color: #7BAB4F;
	padding-left: 0.75em;
	border-left: solid 8px #7BAB4F;
	}

.Campaign h3{
	padding: 0.5em 1em;
	color: #FFF;
	border-left: none;
	position: relative;
	box-shadow:0px 0px 8px 0px #f8b5b4 inset;
	background-color: rgba(230,56,54,0.7);
	}



/*共通_レイアウト*/
.mainContents{display: flex;}

.Article{width: 73.5%; margin-right: 1.25%;}
.Side{width: 24%; margin-top: 1.8em; margin-left: 1.25%;}
.DL_Article{width: 100%;}

.solo_block p{text-align: center; padding-bottom: 3em;}
.solo_block h4{margin-top: 0!important;}

.block02{margin-top: 1.0em; display: flex; flex-wrap: wrap;}
.block02 p,.block02 div{flex: 0 1 48%; margin: 0 1% 1em;}
.youtuber p:first-child{flex: 0 1 20%; margin: 0 1% 1em;}
.youtuber p:last-child{flex: 0 1 76%; margin: 0 1% 1em;}
.youtuber+div.movie{
	width:60% !important;
	margin: 0 !important;
	padding-bottom:34%;
	position:relative;
	}


.block03{display: flex; flex-wrap: wrap;}
.block03 div{flex: 0 1 31%; margin: 0 1% 1em; align-self: stretch;}

.block03a{display: flex; flex-wrap: wrap;}
.block03a div:first-child{flex: 0 1 31%; margin: 0 1% 1em; align-self: stretch;}
.block03a div:last-child{flex: 0 1 45%; margin: 0 1% 1em; align-self: stretch;}
.block03a div:last-child img{width: 70%; height: auto;}

.Side p{margin-bottom: 1.8em;}

.large{font-size: 1.6em;}
.small{font-size: 0.9em;}
.bold{font-weight: bold;}
.blue{color: #00a0e9;}
.red{color: #e00016;}
.yellow{color: #fff799;}
.green{color: #b3d465;}
.brown{color: #c8a063;}


/*共通_リンクボタン*/
.LinkButton{
	border: solid 2px #fff6e6;
	border-radius: 20px;
	text-align: center;
	}

	.LinkButton a{
		width: 100%;
		padding: 0.5em 0;
		color: #fff6e6 !important;
		font-weight: bold;
		display: block;
		}

	.LinkButton:hover{background: #fff6e6;}
	.LinkButton a:hover{color: #7BAB4F !important;}

	/*イベント専用*/
	.eve_info{
		margin: 1.8em 0;
		border: solid 2px #7BAB4F!important;
		background: #7BAB4F !important;
		}

		.eve_info:hover{background: #FFF !important;}
		.eve_info a:hover{color: #7BAB4F !important;}


/*共通_Twitter*/
.Widget{
	margin-bottom: 0.75em;
	background-color:rgba(0,15,36,0.8);
    /*height: 430px;
    overflow-y: scroll;*/
	}

.twitter{
	border: solid 2px #55acee!important;
	background: #55acee !important;
	}

	.twitter:hover{background: #FFF !important;}
	.twitter a:hover{color: #55acee !important;}


/*最新情報一覧_レイアウト*/
#newsBox{margin-top: 1.8em;}

#newsBox a{display: block;}
#newsBox a:hover{background-color: #353535;}

.articleBox{
	padding: 2%;
	border-bottom: solid 1px #535353;
	clear: both;
	overflow: hidden;
	}

	.articleBox:last-child{margin-bottom: 1.8em;}

.artSam{
	max-width: 22%;
	margin-right: 3%;
	float: left;
	}

.artLeadText{}
.artSubText{}


/*イベント*/
#Event h2 + div{padding: 1.5em 0;}
#Event div.Article p{line-height: 1.6em; margin-bottom: 1.0em;}
#Event h3{margin-top: 2em;}

#Event h4{
	margin-bottom: 0;
	padding: 0.45em 0.5em;
	font-size: 1.1em;
	color: #FFF;
	text-shadow: 0px 0px 6px #00a0e9,0px 0px 6px #00a0e9;
	}

#Event h4.cp_notes{text-shadow: 0px 0px 6px #e60012,0px 0px 6px #e60012;}
#Event .block03 h4{font-size: 1em;}

#Event h4:before {
    font-family: "typicons";
    content: '\e0b0';
    font-size: 1.1em;
    margin-right: 0.35em;
	}

#Event div.Article li{color: #e3e3e3!important;}

.SoloBox{margin: 0 1% 1em;}


/*追加*/
.tab-wrap {
	box-shadow: 0 0 5px rgba(0,0,0,.1);
	display: flex;
	flex-wrap: wrap;
	overflow: hidden;
	padding: 1em 0;
    }

.tab-label {
	color: #cdc3b3;
	cursor: pointer;
	flex: 1;
	font-weight: bold;
	order: -1;
	padding: 1em 1%;
	position: relative;
	text-align: center;
	transition: cubic-bezier(0.4, 0, 0.2, 1) .2s;
	user-select: none;
	white-space: nowrap;
	-webkit-tap-highlight-color: transparent;
    flex: 0 1 31%;
    font-size: 0.8em;
    }

.tab-label:hover {background-color: rgba(196,157,97,.1);}
.tab-switch:checked + .tab-label {color: #c49d61;}

.tab-label::after {
	background: #c49d61;
	bottom: 0;
	content: '';
	display: block;
	height: 3px;
	left: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transform: translateX(100%);
	transition: cubic-bezier(0.4, 0, 0.2, 1) .2s 80ms;
	width: 100%;
	z-index: 1;
    }

.tab-switch:checked ~ .tab-label::after {transform: translateX(-100%);}
.tab-switch:checked + .tab-label::after {opacity: 1; transform: translateX(0);}

.tab-content {
    height:0;
	opacity:0;
	padding: 0 20px;
	pointer-events:none;
	transform: translateX(-30%);
	transition: transform .3s 80ms, opacity .3s 80ms;
	width: 100%;
    }

.tab-switch:checked ~ .tab-content {transform: translateX(30%);}
.tab-switch:checked + .tab-label + .tab-content {height: auto; opacity: 1; order: 1; pointer-events:auto; transform: translateX(0);}
.tab-wrap::after {content: ''; height: 20px; order: -1; width: 100%;}
.tab-switch {display: none;}

.tab-label br{display: none;}

label.new{
		background-image: url(../images/download_new.png);
        background-position: left top;
        background-repeat: no-repeat;
        background-size: 35px auto;
		}

@media only screen and (max-width: 600px) {
    .tab-label {flex: 0 1 29%; padding: 1em 2%;}
    /*#TAB-02 + .tab-label{padding-top: 1.5em;}*/
    .tab-label br{display: block;}
    label.new{background-size: 28px auto;}
    }


/*----------*/



.RankList{padding: 1.5em 0;}
.RankList dl{display: flex; align-items: center; border-bottom: dotted 1px #FFF;}
.RankList dt{flex: 0 1 20%; text-align: center;}
.RankList dd{flex: 0 1 80%;}

.RankList p{font-weight: bold;}
.RankList dt p{font-size: 1.4em;}
.SCORE202007 dl:nth-child(n+4):nth-child(-n+11) dt p{color: #7ecef4;}
.SCORE202008 dl:nth-child(n+4):nth-child(-n+10) dt p{color: #7ecef4;}
.SCORE202212 dl:nth-child(n+1):nth-child(-n+11) dt p{color: #7ecef4;}
.SCORE202301 dl:nth-child(n+1):nth-child(-n+10) dt p{color: #7ecef4;}

.RankList br{display: none;}

.comment{border: double 4px #7BAB4F; padding: 1.5em 1.5em 1em;}
.comment h3{margin-top: 0!important;}
.comment p:last-child{padding-top: 0.5em;}

.DairyRank{display: flex; flex-wrap: wrap; align-items: flex-start;}

ul.DairyRank{margin: 0!important; padding: 0;}
.DairyRank li{
	flex: 0 1 18%;
	margin: 0 1%;
	padding: 0;
	text-align: center;
	list-style-type: none;
	}
.DairyRank li a{
	border: solid 1px #ec6938;
	padding: 0.25em 0.5em;
	display: block;
	color: #ec6938!important;
	}
.DairyRank li a:hover{background: #ec6938; color: #FFF!important;}


.Daily{padding: 0 0 1.5em!important;}


#Event .Article ul{margin: 0 0 0 1em; padding: 0;}
#Event .Article li{
	color: #FFF;
	line-height: 1.6em;
	margin-bottom: 0.5em;
	}

.Event_archive{display: flex; flex-wrap: wrap;}
.Event_archive p{flex: 0 1 31%; margin: 1%!important;}

.Mission,.EventList{padding: 0 0 5em!important; text-align: left!important;}

.Fukkoku_list{}
.Fukkoku_list ul{flex: 0 1 30%; margin: 0 1%;}
.Fukkoku_list li{
	height: 47px;
	padding-left: 40px;
	margin-bottom: 0!important;
	list-style-type: none;
	background: url("../images/event_fukkoku_clear.png") no-repeat top left;
	background-size: 30px;
	}


/*上位設定*/
dl.first{}
dl.first dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1.5em;
	padding-top: 100%;
	background:url(../images/event_rank_1st.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}
dl.first p{font-size: 1.2em; margin-bottom: 0.5em!important;}
dl.first dd > p:last-child{font-size: 1.0em;}


dl.second{}
dl.second dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 85%;
	background:url(../images/event_rank_2nd.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}


dl.third{}
dl.third dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 70%;
	background:url(../images/event_rank_3rd.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}

dl.second p,dl.third p{font-size: 1.2em; margin-bottom: 0.5em!important;}
dl.second dd > p:last-child{font-size: 1.0em;}
dl.third dd > p:last-child{font-size: 1.0em;}


#Event table{width: 100%; max-width: 900px; margin-bottom: 0.5em; border: solid 1px #e3e3e3; color: #e3e3e3;}
#Event th{border-bottom: solid 2px #e3e3e3; background: #333333;}
#Event td{border-bottom: solid 1px #e3e3e3;}
#Event th,#Event td{padding: 0.5em; border-right: solid 1px #e3e3e3;}
.Mission th:first-child br,.Mission td:first-child br{display: none;}

@media only screen and (max-width: 480px) {#Event th,#Event td{font-size: 0.9em;}}


/*新人運転士の指南*/
#GuideContent{
	margin-top: 2.0em;
	padding: 0.75em;
	background-color: rgba(92,158,68,0.6);
	}

.artExplanation{
	margin-bottom: 2.5em;
	padding: 1.0em;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	background-color: #FFF;
	}

	.artExplanation:first-child{margin-top: 1.5em;}


.artExplanation h3{
	font-size: 1.5em;
	margin-top: 0.5em;
	padding: 0.45em 0 0.35em;
	color: #FFF;
	text-align: center;
	text-shadow:0px 0px 6px #000;
	border-left: none;
	border-bottom: 5px solid #4b8137;
	background-color: #5c9e44;
	}


.artExplanation h4{
	font-size: 1.2em;
	background-color: #ee1c25;
	}


.artExplanation h5{
	width: 160px;
	font-size: 1.0em;
	background-color: #c3996b;
	}

	/*新人運転士の指南_見出しまとめ*/
	.artExplanation h4,.artExplanation h5{
		margin-bottom: 0.75em;
		color: #FFF;
		padding: 0.35em 0.5em;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		}


.artExplanation p{
	color: #434343;
	line-height: 1.6em;
	}

.detail{padding-bottom: 3em;}

div.Box02,div.Box03{display: flex;}

	.Box02 div{
		width: 48%;
		margin: 0 1%;
		display: block;
		}

	.Box03 div{
		width: 31%;
		margin: 0.5em 1%;
		display: block;
		}

	.gameSS{margin: 0.5em 0 0; padding-bottom: 3em; text-align: center;}

	.notes{
		margin-top: 1.5em;
		padding: 0.5em;
		color: #FFF!important;
		background: #c3996b;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		}


/*運転士上達への道*/
.manualArt{margin: 0 1em 8em;}
.manualArt:last-child{margin: 0 1em;}

.manualArt h3{margin-top: 1.5em;}

.manualArt h4{
	padding-bottom: 0.25em;
	font-size: 1.1em;
	list-style: 1.6em;
	color: #e3e3e3;
	border-bottom: double #dcdcdc;
	text-shadow: 0px 0px 6px #22ac38;
	}

.manualArt h5{
	margin: 2em 0 0.75em;
	color: #e3e3e3;
	font-size: 1.1em;
	text-shadow: 0px 0px 6px #edb301;
	}

	.manualArt h5:before{
		font-family: "typicons";
		content: '\e0b0';
		font-size: 1.25em;
		margin-right: 0.35em;
		}

	.manualArt h4 + h5{margin: 0 0 0.75em;}
	.gameSS + h5{margin: 0 0 0.75em;}


.manualArt p{line-height: 1.6em;}
.manualArt li{line-height: 1.6em; color: #e3e3e3;}

.manualArt p.LinkButton{margin: 0.75em 0;}


/*稼動店舗リスト*/
#Location section{margin-bottom: 10%;}
#Location section:first-child{margin-bottom: 0;}

ul.Running_start{
	margin-top: 2.5%;
	margin-bottom: 7%;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	list-style-type: none;
	}

ul.Running_start li{flex: 0 1 15%; margin: 0.25em 0.5%;}

ul.Running_start p:before{
	font-family: "typicons";
	content: '\e0b0';
	font-size: 1.0em;
	margin-right: 0.35em;
	}

ul.Running_start a{
	color: #7BAB4F!important;
	padding: 0.25em 0;
	display: block;
	border: solid 1px #7BAB4F;
	text-align: center;
	}

	ul.Running_start a:hover{background-color: #FFF; color: #7BAB4F!important;}

#Location table{width: 100%; color: #e3e3e3; text-align: left;}
#Location th{padding: 0.5em; border-bottom: solid 2px #e3e3e3;}
#Location td{padding: 0.5em; border-bottom: dotted 1px #e3e3e3;}
	#Location td:first-child{width: 45%;}
	#Location td:last-child{font-size: 0.9em;}



/*稼動店舗リスト_xml*/
#Location h4{
	padding: 0.45em 0.5em;
	font-size: 1.1em;
	color: #FFF;
	background-color: #7BAB4F;
	box-shadow:0px 0px 4px 0px #FFF inset;
	-moz-box-shadow:0px 0px 4px 0px #FFF inset;
	-webkit-box-shadow:0px 0px 4px 0px #FFF inset;
	}


#Location p.time{text-align: right;}


#Location p.time:before{
	font-family: "typicons";
	content: '\e120';
	font-size: 1.4em;
	margin-right: 0.35em;
	}


#Location dl{margin-bottom: 10%;}

#Location dt{
	width: 40%;
	padding: 0.75em 1%;
	font-weight: bold;
	border-top: 1px solid #7d7d7d;
	display: inline-block;
	vertical-align: top;
	}

	#Location dt:first-child{border-top: none;}

#Location dd{
	width: 56%;
	margin: 0 !important;
	padding: 0.75em 1%;
	border-top: 1px solid #7d7d7d;
	font-size: 0.9em;
	display: inline-block;
	vertical-align: top;
	}

	#Location dt:first-child + dd{border-top: none;}



/*スペシャル*/
#Special h4{
	margin-top: 3.0em;
	margin-bottom: 0.5em;
	padding: 0.25em;
	color: #e3e3e3;
	border-bottom: dotted 1px #FFF;
	}

	h4.New{margin-top: 0 !important;}

#Special h4:before{
	font-family: "typicons";
	content: '\e00b';
	font-size: 1.4em;
	margin-right: 0.35em;
	}

#Special h4.New:before{
	font-family: "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif";
	content: "NEW!!";
	padding: 0.25em 0.65em;
	margin-right: 0.75em;
	display: inline-block;
	font-size: 0.8em;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	color: #FFF;
	background-color: #FF0000;
	}

.movieLog{margin-top: 5%; display: flex; flex-wrap: wrap;}
.movieLog div{width: 48%; margin: 0 1% 1.5em;}
.movieLog h3{width: 100%;}
.movieLog h4{margin-top: 0!important;}

.movie{
	width:100% !important;
	margin: 0 !important;
	padding-bottom:56.25%;
	position:relative;
	}

.movie iframe{
	width:100%;
	height:100%;
	top:0;
	right:0;
	position:absolute;
	}



/*店舗用素材*/
.lastdate{margin-top: 2em;}

.pop{margin: 2em 0;}

.pop h3{
	font-size: 1.1em;
	line-height: 1.4em;
	margin: 0;
	padding: 1em 0;
	border-left: none;
	text-align: center;
	color: #FFF;
	background-color: rgba(255,255,255,0.1);
	}

	.pop h3.new{
		background: url(../images/download_new.png) no-repeat left top rgba(255,255,255,0.1);
		background-size: 13.5%;
		}

.pop p.small{font-weight: normal; font-size: 0.8em!important;}

.material{display: block; padding-bottom: 5em;}
.material div{border: solid 1px #FFF; height: 100%;}
.material h3+p{margin: 1em; text-align: center;}

.material p.small{text-align: right; margin-bottom: 1.5em;}

.pop p.LinkButton,.pdf p.LinkButton{
	padding: 0.35em;
	color: #7BAB4F;
	font-weight: bold;
	border: solid 2px #7BAB4F;
	}

	.pdf p.LinkButton{width: 40%; margin: 1em 0 2em;}
	.pop p.LinkButton:hover,.pdf p.LinkButton:hover{background: #7BAB4F; color: #FFF;}

.pdf{
	margin: 0 1% 1%;
	padding: 1em;
	border: double #FFF;
	color: #FFF;
	}

.pdf h4{color: #F00;}
.pdf li{margin-bottom: 0.8em;}


/*ＧＯマイスター*/
#GO_Meister table{
	width: 96%;
	color: #FFF;
	border: solid 1px #FFF;
	}

#GO_Meister th{background: #313131;}

#GO_Meister th,#GO_Meister td{
	padding: 0.5em;
	border: solid 1px #FFF;
	color: #FFF;
	text-align: center;
	}



/*--------------Footer--------------*/

footer{
	margin-left: 300px;
	padding: 4em 2.5%;
	background-color: #000;
	}


ul.taitoLink{
	margin-top: 1.0em;
	padding-left: 1.0em;
	display: flex;
	}

	ul.taitoLink li{margin-right: 1.8em; color: #e3e3e3;}


footer p{
	margin-bottom: 0.25em;
	font-size: 0.9em;
	line-height: 1.2em;
	}

	footer p:first-child{margin-top: 1.5em;}



/*----------トップへ戻る----------*/
#pageTop a{
	width: 76px;
	height: 76px;
	border:solid 2px #FFF;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	position: fixed;
	bottom: 40px;
	right: 40px;
	z-index: 999;
	text-align:center;
	}

#pageTop a:hover{background:rgba(0,0,0,0.5);}

#pageTop img{padding-top: 12.5%;}


/*稼動店舗リスト*/
dl#Store_01,dl#Store_02,dl#Store_03,dl#Store_04,dl#Store_05,dl#Store_06{margin-top: -80px; padding-top: 80px;}

	



/*----------------------------タブレット----------------------------*/

@media only screen and (max-width: 1024px) {
	
header{width: 220px;}
main{margin:0 0 0 240px;}


.FlexBox{display: block;}


/*TOP_レイアウト*/
.topArticle_01{width: 100%; margin-right: 0;}
.topArticle_02{width: 100%; margin-left: 0; margin-top: 8%;}
	
	
/*TOP_運行状況*/
.Status dt{width: 18%;}
.Status dd{width: 75%;}


/*TOP_ページ下部バナー*/
ul.banner {margin: 16% 0 0; padding: 0;}
.banner li{width: 48%; margin: 0 1% 0.75em; text-align: center;}
	
	
/*パンくずリスト*/
.pageList{width: 100%; display: block;}
.pageList ul{margin-top: 0; margin-bottom: 1.0em!important; padding-left: 1.35em;}

	
/*共通_レイアウト*/
.mainContents{display: block;}

.Article{width: 100%; margin-right: 0;}
.Side{
	width: 100%;
	margin-left: 0;
	display: flex;
	flex-wrap: wrap;
	}
	
.Side p{width: 48%; margin: 0 1%; display: block;}
.Side div{width: 99%!important; margin: 0.35em auto 0;}
.Side p.LinkButton{width: 100%!important; margin-top: 0.5em;}

.block03a div:last-child img{width: auto; height: auto;}

/*--------------Footer--------------*/

footer{margin-left: 240px;}

}





@media only screen and (max-width: 860px) {

	
/*--------------Navigation--------------*/

header{
	width: 96%;
	padding: 0.5em 2%;
	height: auto;
	position: fixed;
	top: 0;
	background-color: rgba(37,37,37,0.9);
	}

	header > h1{display: none;}
	
	
#toggle{
	padding: 0 !important;
	display: block;
	text-align: left;
	position: relative;
	}
	
	#toggle h1{margin: 0;}
	#toggle h1 img{height: 35px;}
	
	#toggle a{padding: 0.35em; display: block;}
	
	#toggle a:after {
			font-size: 2.0em;
			color: #c8a063;
	        font-family: 'typicons';
	        content: '\e116';
			display: inline-block;
			position: absolute;
			top:5px;
			right: 10px;
			}

	
ul#MENU{display: none; margin: 1.5em 0 0;}

ul#MENU a{
	width: 100%;
	padding: 0.95em 0 0.95em 60px;
	}

/*--------------SNS--------------*/

header ul.SNS{display: none;}

	
/*--------------MAIN--------------*/
	
main{margin: 80px 0 0; padding: 0 1.5em 10%;}

section{margin-top: 8%;}


.block03 div{flex: 0 1 48%; margin: 0 1% 1em; align-self: stretch;}
.block03a{display: block;}
.block03a div:first-child{flex: 0 1 48%;}
.block03a div:last-child{flex: 0 1 48%;}


/*稼動店舗リスト*/
dl#Store_01,dl#Store_02,dl#Store_03,dl#Store_04,dl#Store_05,dl#Store_06{margin-top: -150px; padding-top: 150px;}

	
/*素材ダウンロード*/
.pdf p.LinkButton{width: 80%;}


/*イベント*/
#Ranking{margin-top: -80px; padding-top: 80px;}

.RankList dt{flex: 0 1 25%;}
.RankList dd{flex: 0 1 75%;}
.RankList br{display: block;}
	


/*上位設定*/
dl.first dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 100%;
	background:url(../images/event_rank_1st.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}

dl.second dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 90%;
	background:url(../images/event_rank_2nd.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}

dl.third dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 85%;
	background:url(../images/event_rank_3rd.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}


	
	
/*--------------Footer--------------*/

footer{margin: 0;}



/*----------トップへ戻る----------*/
#pageTop a{
	width: 60px;
	height: 60px;
	border:solid 2px #FFF;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 999;
	text-align:center;
	}

#pageTop a:hover{background:rgba(0,0,0,0.5);}

#pageTop img{width:60%; padding-top: 12.5%;}

}


/*----------------------------スマートフォン----------------------------*/

@media only screen and (max-width: 480px) {

	
/*--------------Navigation--------------*/
#toggle h1 img{height: 25px;}

#toggle a:after {
		font-size: 1.8em;
		top:5px;
		}


/*--------------MAIN--------------*/
main{padding: 0.75em 0.75em 30%; margin: 60px 0 0;}
	
.mainContents{display: block;}
.Article{width: 100%;}
.Side{width: 100%;}

	
/*TOP_運行状況*/
.Status{
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	}

.Status dl{
	margin: 0;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	display: block;
	}

.Status dt{
	width: auto;
	padding: 0.65em 0.5em;
	}

.Status dd{
	width: auto;
	margin: 0;
	padding-left: 0;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
	-o-border-radius: 0;
	border-top:solid 3px rgba(153,187,235,0.4);
	}

.Status dd div{
	padding-left: 0;
	border-top:solid 5px rgba(153,187,235,0.5);
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
	-o-border-radius: 0;
	background-color: none;
	}

.Status dd p{
	color: #85c300;
	padding: 0.65em 2.5%;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
	-o-border-radius: 0;
	background-color: none;
	}
	
	/*運行状況_重要度高*/
	.high dd{border-top:solid 3px rgba(255,0,4,0.4);}
	.high dd div{border-top:solid 5px rgba(255,0,4,0.5);}
	.high dd p{color: #e60012;}
	
	
/*Twitter*/
.topArticle_01 div.Widget{width: 88%; margin: 0 auto 0.75em auto;}

	
/*パンくずリスト*/
.pageList{display: none;}


.block02 {display: block;}
.block03 {display: block;}
.material{padding-bottom: 3em;}

	
/*イベント*/
.RankList dl{display: block;}
.RankList dd{margin: 0.5em!important;}

.Event_archive p{flex: 0 1 48%; margin: 1%!important;}
.Mission th:first-child,.Mission td:first-child{width: 25%;}
.Mission th:nth-child(3),.Mission td:nth-child(3){width: 20%;}
.Mission th:last-child, .Mission td:last-child{width: 20%;}
.Mission th:first-child br,.Mission td:first-child br{display: block;}

/*上位設定*/
dl.first dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 160px;
	background:url(../images/event_rank_1st.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}
dl.first p{font-size: 1.2em;}


dl.second{}
dl.second dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 140px;
	background:url(../images/event_rank_2nd.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}

dl.third{}
dl.third dt > p{
	width: 100%;
	height: 0;
	margin: 0 0 1em;
	padding-top: 110px;
	background:url(../images/event_rank_3rd.jpg) no-repeat;
	background-size: contain;
	overflow: hidden;
	display: block;
	background-position: center;
	}

dl.second p,dl.third p{font-size: 1.1em;}

	
	
/*新人運転士の指南*/
div.Box02,div.Box03{display: block;}

	.Box02 div{
		width: 98%;
		margin: 1%;
		display: block;
		}

	.Box03 div{
		width: 98%;
		margin: 1%;
		display: block;
		}
	
/*稼動店舗リスト*/
#Location section{margin-bottom: 30%;}

	
ul.Running_start{
	margin-top: 5%;
	margin-bottom: 14%;
	flex-wrap: wrap;
	list-style-type: none;
	}

ul.Running_start li{flex: 0 1 48%;}
	ul.Running_start li:first-child{width: 100%;}

	
#Location table{width: 100%; color: #e3e3e3; text-align: left;}
#Location th{display: block;}
	#Location th:first-child{border-bottom: none; padding-bottom: 0;}

#Location td{display: block;}
	#Location td:first-child{
		width: 94.8%;
		padding-top: 1em;
		font-weight: bold;
		border-bottom: none;
		}
	#Location td:last-child{padding-bottom: 1em;}
	
	
/*稼動店舗リスト_xml*/
#Location dl{margin-bottom: 10%;}

#Location dt{
	width: 98%;
	padding: 0.95em 1% 0;
	font-weight: bold;
	border-top: 1px solid #7d7d7d;
	display: block;
	vertical-align: top;
	}

	#Location dt:first-child{border-top: none;}

#Location dd{
	width: 98%;
	margin: 0 !important;
	padding: 0.45em 1% 0.95em;
	border-top: none;
	font-size: 0.9em;
	display: block;
	vertical-align: top;
	}

	#Location dt:first-child + dd{border-top: none;}

/*ランキング*/
.DairyRank li{flex: 0 1 31%; font-size: 0.8em;}
.DairyRank li a{padding: 0.5em;}
	
/*イベント*/
.youtuber p:first-child{width: 45%; margin: auto;}
.youtuber+div.movie{
	width:90% !important;
	margin: 0 auto!important;
	padding-bottom:51.25%;
	position:relative;
	}
	
/*スペシャル_動画*/
.movieLog{display: block;}
.movieLog div{width: 98%;}

	

/*素材ダウンロード*/
.pdf p.LinkButton{width: 100%;}

	
/*--------------Footer--------------*/
footer{padding: 1.5em 5% 2.5em;}

ul.taitoLink{
	margin-top: 1.5em;
	display: block;
	}

	ul.taitoLink li{margin-right: 0; margin-bottom: 0.5em;}

}
