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

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
 margin:0;
 padding:0;
 border:0;
 outline:0;
 vertical-align:baseline;
 font-size:100%;
}
html, body{
	margin-left:auto;
	margin-right:auto;
}
#menu_fix_a{
	position:relative;
	top:0;
	left:0;
}

.up_tri{
	position:relative;
	top:0;
	padding-left:1em;	
}
.up_tri:before{
	display:block;
	content:"▲";
	position:absolute;
	width:1em;
	height:auto;
	left:0;
	top:50%;
	transform:translateY(-50%);
}

.under_tri{
	position:relative;
	top:0;
	padding-left:1em;	
}
.under_tri:before{
	display:block;
	content:"▼";
	position:absolute;
	width:1em;
	height:auto;
	left:0;
	top:50%;
	transform:translateY(-50%);
}
.menu_fix_a_a{
	position:relative;
	top:0;
	padding-left:1em;	
}

.menu_fix_a-open:before{
	display:block;
	content:"▼";
	position:absolute;
	width:1em;
	height:auto;
	left:0;
	top:50%;
	transform:translateY(-50%);
}
.menu_fix_a-close:before{
	display:block;
	content:"▲";
	position:absolute;
	width:1em;
	height:auto;
	left:0;
	top:50%;
	transform:translateY(-50%);
}

html,body{
	max-width: 2000px;
	width: 100%;
	height: auto;
	/* [disabled]margin-left:auto; */
	margin-right: auto;
}

main{
	display:block;
}

img{
	width:100%;
	height:auto;
}

a:hover{
	opacity:0.5;
}

/*pan*/
.pan_li{
	position:relative;
	top:0;
	left:0;	
	padding-right:2em;
}

.pan_ul{
	width:90%;
}
.pan_li:after{
	content:"";
	width:0.6em;
	height:0.882em;
	position:absolute;
	background-image:url(img/only_yokotri_icon.svg);
	background-size:contain;
	background-repeat:no-repeat;
	top:50%;
	transform:translateY(-50%);
	right:0.5em;
}

.pan_li:last-child:after{
	display:none;
}

/*汎用クラス*/
.ten_p{
	position:relative;
	top:0;
	left:1em;
}

.ten_p:before{
	font-size:1em;
	font-family:"yugo";
	content:"・";
	position:absolute;
	top:0%;
	left:-1em;
}

.kensei_ul{
	display:none;
	list-style:none;
}

.kensei_li{
	padding:0.25em 0.65em 0.25em 0.65em;
	border-radius:35px 35px;
	margin-left:5px;
	margin-right:5px;
}
.yoko_tri{
	width:1.5em;
	height:1.5em;	
}

.vermiddle{
	vertical-align:middle;
}

.new_icon{
	top:0;
	left:50%;
	transform:translate(-50%,-125%);
	width:3em;
}
.new_icon2{
	width:3em;
}
.pc_onlyblock{
	display:block;	
}

.mb_onlyblock{
	display:none;
}
.smb_onlyblock{
	display:none;
}

.maru_p{
	position:relative;
	top:0;
	left:1.2em;
}

.maru_p:before{
	content:"";
	position:absolute;
	color:#6a0819;
	width:1em;
	height:1em;
	background-image:url(img/maru.svg);
	background-repeat:no-repeat;
	background-size:contain;
	top:0;
	left:-1.2em;
	transform:translateY(28%);
}
.button_p {
    padding: 0px 1.5em 0px 1.5em;
}
.maru_a{
	position:relative;
	top:0;
	left:1.3em;
}
.maru_a:before{
	content:"";
	position:absolute;
	color:#6a0819;
	width:1.3em;
	height:1.3em;
	background-image:url(img/maru.svg);
	background-repeat:no-repeat;
	background-size:contain;
	top:50%;
	left:-1.5em;
	transform:translateY(-50%);
}

@font-face{
	font-family:"kozgo";
	src:url(font/kozgo.woff2) format("woff2"),
	url(font/kozgo.woff) format("woff"),
	url(font/kozgo.otf) format("opentype");
}

.fontkozgo{
	font-family:"kozgo";
}

@font-face{
	font-family:"kozgo-m";
	src:url(font/kozgo-m.woff2) format("woff2"),
	url(font/kozgo-m.woff) format("woff"),
	url(font/kozgo-m.otf) format("opentype");
}

.fontkozgo-m{
	font-family:"kozgo-m";
}
@font-face{
	font-family:"yugo";
	src:url(font/yu-go.woff2) format("woff2"),
	url(font/yu-go.woff) format("woff"),
	url(font/yu-go.ttf) format("truetype"),
	url(font/yu-go.eot) format("eot"),
}

.fontyugo{
	font-family:"yugo";
}
@font-face{
	font-family:"yumin";
	src:url(font/yumin.woff2) format("woff2"),
	url(font/yumin.woff) format("woff"),
	url(font/yumin.ttf) format("truetype"),
	url(font/yumin.eot) format("eot"),
}

.fontyumin{
	font-family:"yumin";
}

.fontred{
	color:#6a0819;
}


.widthauto{
	width:auto !important;
}

.blockcenter{
	margin-left:auto;
	margin-right:auto;
}

.displayblock{
	display:block !important;
}

.displayinlineblock{
	display:inline-block !important;
}

.displayflex{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}


.displaynone{
	display:none;
}

.flexaligntop{
	-webkit-box-align: start;
	align-items: flex-start;
}

.flexalignbottom{
	-webkit-box-align: end;
	align-items: flex-end;
}

.flexcolum{
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
}

.flexcolumcenter{
	-webkit-box-align: center;
	align-items: center;
}

.flexjustright{
-webkit-box-pack: end;
justify-content: flex-end;
}

.positionrela{
	position:relative;
}

.positionfixed{
	position:fixed;
}

.positionab{
	position:absolute;
}

.displaybetween{
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.flexjustcenter{
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
.flexwrap{
	-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

.flexaligncenter{
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.margintop60px{
	margin-top:60px;
}


.margintop5px{
	margin-top:5px;
}

.margintop10px{
	margin-top:10px;
}
.margintop15px{
	margin-top:15px;
}


.margintop20px{
	margin-top:20px;
}


.margintop30px{
	margin-top:30px;
}

.margintop40px{
	margin-top:40px;
}

.margintop50px{
	margin-top:50px;
}

.margintop60px{
	margin-top:60px;
}

.margintop80px{
	margin-top:80px;
}

.marginbottom5px{
	margin-bottom:5px;
}


.marginbottom30px{
	margin-bottom:30px;
}

.marginbottom50px{
	margin-bottom:50px;
}


.paddingtop5px{
	padding-top:5px;
}
.paddingtop8px{
	padding-top:8px;
}
.paddingtop60px{
	padding-top:60px;
}
.paddingbottom5px{
	padding-bottom:5px;
}


.paddingtop15px{
	padding-top:15px;
}

.paddingtop30px{
	padding-top:30px;
}

.paddingbottom15px{
	padding-bottom:15px;
}
.paddingbottom30px{
	padding-bottom:30px;
}
.paddingtop17px{
	padding-top:17px;
}

.textcenter{
	text-align:center !important;
}

.textleft{
	text-align:left;
}

.textright{
	text-align:right;
}

.textjust{
	text-align:justify;
}

.fontwhite{
	color:#fff;
}

.fontblue{
	color:#009;
}
.fontsize14px{
	font-size:14px !important;
}
.fontsize15px{
	font-size:15px !important;
}
.fontsize17px{
	font-size:17px !important;
}

.fontsize18px{
	font-size:18px !important;
}

.fontsize20px{
	font-size:20px !important;
}
.fontsize23px{
	font-size:23px !important;
}
.fontsize25px{
	font-size:25px !important;
}

.fontsize30px{
	font-size:25px !important;
}
.fontsize28px{
	font-size:28px !important;
}

.fontsize32px{
	font-size:32px !important;
}
.fontsize35px{
	font-size:30px !important;
}

.fontsize34px{
	font-size:34px !important;
}
.fontsize45px{
	font-size:45px !important;
}

.fontsize50px{
	font-size:50px !important;
}

.fontsize55px{
	font-size:55px !important;
}

.fontsize60px{
	font-size:60px !important;
}

.fontbold{
	font-weight:bold;
}

.fontlight{
	font-weight:lighter;
}

.backred{
	background-color:#6a0819;	
}

.coloryellow{
	color:#fff571;	
}

.width30per{
	width:30%;
}

.width40per{
	width:40%;
}

.width45per{
	width:45%;
}

.width48per{
	width:48%;
}

.width50per{
	width:50%;
}
.width60per{
	width:60%;
}

.width70per{
	width:70%;
}



.width75per{
	width:75%;
}

.width80per{
	width:80%;
}

.width85per{
	width:85%;
}

.width90per{
	width:90%;
}


.width95per{
	width:95%;
}

.width100per{
	width:100%;
}

.pc_block{
	display:block;
}

.mb_block{
	display:none;
}

.pad_br{
	display:none;
}

.mb_br{
	display:none;
}

.letterspa-20{
	letter-spacing:-20px;
}

.menu_fix{
	width:90%;
	padding:0 5% 0 5%;
	top:0;
	left:0;	
	z-index:10000;
}

.menu_fix_li{
	padding:0.5em 1em;
}
footer{
	width:90%;
	border-top:6px solid #1b2d69;
}

.logo{
	width:22%;
	padding-right:1%;
	border-right:8px solid #1b2d69;
}



@media(min-width:1000px){
	.spc_paddingtop16px{
		padding-top:16px;
	}
	
}
@media(min-width:1600px){
	.bpc_paddingtop19px{
		padding-top:19px;
	}
	
}
@media(max-width:1000px){
		
	.mb_br{
		display:block;
	}
	
	.pad_br{
		display:block;
	}
	
	.pad_paddingtop10px{
		padding-top:10px;
	}
}

@media(max-width:800px){
	.new_icon3{
		left:0;
		width:1.4em;
		transform:translateX(-110%);
	}
	
	
	.pad_displayflex{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
	
	.mb_space{
		margin-left:0.5em;
		border-top:none !important;
	}
	.kensei_li{
		width:33%;
	}
	.mb_positionrela{
		position:relative !important;
	}
	.mb_displayblock{
		display:block !important;
	}
	
	.pc_block{
		display:none;
	}
	
	.mb_block{
		display:block;
	}
	
	
	.mb_blockcenter{
		margin-left:auto !important;
		margin-right:auto !important;
	}
	
		
	.mb_width30per{
		width:20% !important;
	}
	
	.mb_width60per{
		width:60% !important;
	}
	
	.mb_width85per{
		width:85% !important;
	}
		
	.mb_width90per{
		width:90% !important;
	}
	
	.mb_width100per{
		width:100% !important;
	}
	
	
	.mb_margintop5px{
		margin-top:5px;
	}
	.mb_margintop8px{
		margin-top:8px;
	}
		.mb_margintop15px{
		margin-top:15px;
	}
	
	.mb_margintop20px{
		margin-top:20px !important;
	}
	
	.mb_fontsize35px{
		font-size:30px !important;

	}
		
	.mb_fontsize30px{
		font-size:25px !important;
	}
	
	.pad_fontsize80per{
		font-size:80%;
	}

	
	
	.letterspa-20{
		letter-spacing:0;
	}
	.mb_margintop12px{
		margin-top:12px !important;
	}
	
	.mb_margintop25px{
		margin-top:25px !important;
	}
	.mb_margintop50px{
		margin-top:50px !important;
	}
	.mb_margintop60px{
		margin-top:60px !important;
	}
	.mb_margintop100px{
		margin-top:100px !important;
	}
	
	.mb_fontsize8px{
		font-size:8px !important;
	}	
	.mb_fontsize14px{
		font-size:14px !important;
	}
	
	
	.mb_fontsize18px{
		font-size:18px !important;
	}
	
	.mb_fontsize20px{
		font-size:20px !important;
	}	
	
	
	.mb_fontsize22px{
		font-size:22px !important;
	}	
	
	
	.mb_fontsize25px{
		font-size:25px !important;
	}
		
	
	.mb_textcenter{
		text-align:center !important;
	}
	.logo{
		width:40% !important;
		border-right:none !important;
		border-bottom:6px solid #1b2d69;
	}
	
}


@media(max-width:780px){
	.pad_width55{
		width:55% !important;	
	}

}
@media(max-width:550px){
	.kensei_li{
		width:90%;
	}	
	.smb_margintop10px{
		margin-top:10px !important;
	}
}
@media(max-width:480px){
	.mb_font70per{
		font-size:70%;
	}

	.menu_fix_li{
		text-align:left;
		width:40%;
		padding: 0.1em 1% 0.1em 9%;
	}
	
	.smb_textjust{
		text-align:justify !important;
	}

	.smb_width85{
		width:85% !important;	
	}
	.smb_width100{
		width:100% !important;
	}
	.smb_fontsize16px{
		font-size:16px !important;
	}
	.smb_fontsize18px{
		font-size:18px !important;
	}
	.smb_fontsize22px{
		font-size:22px !important;
	}
	.smb_fontsize26px{
		font-size:26px !important;
	}
	.pc_onlyblock{
		display:none;
	}
	.smb_onlyblock{
		display:block;
	}
	.mb_onlyblock{
		display:block;
	}
	.smb_fontsize20px{
		font-size:20px;
	}
	.smb_displayblock{
		display:block !important;
	}
	.mb_displayflex{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
	
	.mb_space{
		margin-left:0.5em;
		border-top:none !important;
	}
	.mb_marginright15px{
		margin-right:15px !important;	
	}

	.mb_paddingtop4px{
		padding-top:4px !important;
	}
	.mb_paddingtop6px{
		padding-top:6px !important;
	}	
	.mb_paddingtop8px{
		padding-top:8px !important;
	}
	.smb_width30per{
		width:30% !important;
	}
	.mb_width50per{
		width:50% !important;
	}
	.mb_width70per{
		width:70% !important;
	}	
	.mb_width80per{
		width:80% !important;
	}
	.mb_width100per{
		width:100% !important;
	}
	/*.mb_fontsize18px{
		font-size:18px !important;
	}*/
	footer{
		width:95%;
	}
	.mb_margintop30px{
		margin-top:30px !important;
	}
}

@media(max-width:330px){
	.ssmb_displayblock{
		display:block !important;
	}
	.ssmb_width100per{
		width:100% !important;
	}
}
