:root{

 --keycolor-txt: #222222;

 --keycolor-base:#F5F6F9;
 --keycolor-base2:#D9D9D9;
 --keycolor-base3:#989898;

 --keycolor-lightblue:#1EC7D2;
 --keycolor-lightblue-txt:#1ac0cb;
 --keycolor-darkblue:#0E608E;

 --keycolor-yellow:#FFDE67;

 --keycolor-tag-blue:#183FC9;
 --keycolor-tag-green:#34C40E;
 --keycolor-tag-orange:#FFAD0D;
 --keycolor-tag-red:#FF5169;
 --keycolor-tag-purple:#5620DE;

 --keycolor-form-red:#FF5169;
 --keycolor-form-red-shadow:#d82b43;

 --keycolor-card-blue:#1A40C8;

}

* {
	margin:0px;
	padding:0px;
	border:0px;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; 
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "MS PGothic", sans-serif;
	 -webkit-text-size-adjust: 100%;
	 	-webkit-font-smoothing: antialiased;
	 font-weight:normal;
	 font-feature-settings: "palt";
  }

/* reset */
a,
button,
input,
select,
h1,
h2,
h3,
h4,
h5,
* {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
		border: none;
		text-decoration: none;
		background: none;

		-webkit-font-smoothing: antialiased;
}

menu, ol, ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
}
table{
	border-collapse: collapse;
}

img{
	vertical-align:top;
}


html,body {
	min-height:100vh;
	line-height:1.5;
	-webkit-tap-highlight-color:
	rgba(0,0,0,0.8);
	color:var(--keycolor-txt);
	background-color:var(--keycolor-base);
	font-size: 62.5%;
	position:relative;
}


input {
	font-size:1.4rem;
}
* a {
	color:#4f9dda;
	text-decoration: none;
}
textarea:focus,  input[type="text"]:focus{
	border: 1px solid  var(--keycolor-search);
}


.left{
	text-align:left;
}
.right{
	text-align:right;
}
.center{
	text-align:center;
}



/* ヘッダー */
#header-bg{
	position: sticky;
	top: -30px;
	width: 100%;
	margin: 0 auto;
	color: #ffffff;
	z-index:10;
}
#header-bg .m{
	display: block;
	width:100%;
	margin:0 auto;
	padding: 2px 3% 5px;
	font-size:1.4rem;
	background: #cd2336;
	color: #fff;
	text-align:center;
}
#header-bg .bar{
	width:100%;
	height: 14px;
	display: flex;
	justify-content:space-between;
	padding: 0px calc((100% - 700px) / 2);
	background: #673802;
	color: #fdf6df;
	line-height: 0.4;
	font-size: 3.1rem;
	position:relative;
}
#header-bg .bar:after{
	content: '';
	background-color: #fdf6df;
	background-image: url(/parts/cloth-alike.png);
	height: 10px;
	left: calc(50% - ((684px * 0.9) / 2));
	width: calc(684px * 0.9);
	bottom: -10px;
	position: absolute;
	z-index:51;
}




/* グローバルナビ */
#gnav{
	position: sticky;
	top: -44px;
	z-index: 50;
	width: 684px;
	margin: 0 auto;
	padding: 0px 1% 5px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 5px;
}
#gnav a{
	width: 100%;
	height: 90px;
	padding: 16px 0 5px;
	background: #fdf6df;
			background-image: url(/parts/cloth-alike.png);
	color: #55262b;
	font-size: 2rem;
	text-align: center;
	display:flex;
	justify-content: center;
	align-items: center;
	border-radius: 0 0 5px 5px;
	box-shadow: 3px 5px 2px rgba(0, 0, 0, 0.2);	
	position:relative;
}
#gnav a:before,#gnav a:after{
	content: '';
	position: absolute;
	background: #fdf6df;
	background-image: url(/parts/cloth-alike.png);
	color: #fdf6df;
	width: 14px;
	height: 14px;
	top: -14px;
	font-size: 2.5rem;
}
#gnav a:before{
	left:12px;
}
#gnav a:after{
	right:12px;
}



/*footer*/
#footer-bg{
	width:100%;
	margin: 0px auto;
	padding:50px 0;
	background-color: #72152b;
	color:#fff;
	text-align: center;
	
}
.footer-links{
	font-size:16px;
	line-height:2;

}
.footer-links span{
	font-weight: bold;
	border-bottom: 1px #ffffff55 solid;
	width: 200px;
	display: block;
	margin: 0 auto 10px;
}
.foot_link{
	color:#fff;
}
.f-copy{
	padding:50px 0;
	font-size:1.6rem;
}




/*スピードチェック用*/
.speed{
	position:absolute;
	top:3px;
	right:3px;
	z-index: 100;
}

.speed2{
	margin-bottom:10px;
 	font-size:1.2rem;
}