@charset "utf-8";
@import url("global.css");

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, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; list-style:none;}
*, *::before, *::after { box-sizing: border-box;}
html{ font-size: 62.5%; overflow: auto;}
body {
	font: 1.4rem/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	scroll-behavior: smooth;
	text-rendering: optimizeSpeed;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
}
article, aside, dialog, figure, footer, header, hgroup, nav, section { display:block;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after, q:before, q:after { content:""; content:none;}
a { margin:0; padding:0; border:0; outline:none; font-size:100%; vertical-align:baseline; background:transparent; box-sizing:border-box;}
ins { background-color:#ff9; color:#000; text-decoration:none;}
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}
del { text-decoration: line-through;}
abbr[title], dfn[title] { border-bottom:1px dotted #000; cursor:help;}
img{ vertical-align:bottom;}
address, caption, cite, code, dfn, em, th, var { font-style:normal; font-weight:normal;}
table { border-collapse:collapse; border-spacing:0;}
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}
input, button, textarea, select { vertical-align: middle; outline: none; font: inherit;}
label{ cursor: pointer;}
/* supsub */
sup{ font-size: 6px; vertical-align:top;}
sub{ font-size: 6px; vertical-align:bottom;}
/* img */
img{
	-webkit-backface-visibility: hidden;//cromeの画像ボケを解消
	width:auto; max-width:100%; height:auto; object-fit: cover;//はみ出しと伸び縮み防止
}
a,span {
	display: inline-block;//上下の余白を使えるようにする
}
/* inblock */
.inblock{ display:inline-block;}

/* font */
.gothic{ font-family:var(--gothic);}
.mincho{ font-family:var(--mincho);}
.eng { font-family:var(--eng);}

/* テキスト */
.f-xsmall { font-size: var(--x-small);}
.f-small { font-size: var(--small);}
.f-midium { font-size: var(--midium);}
.f-large { font-size: var(--large);}
.f-xlarge { font-size: var(--x-large);}
.f-xxlarge { font-size: var(--xx-large);}
.f-xxxlarge { font-size: var(--xxx-large);}
.bold {font-weight: bold;}
.f-normal {font-weight: normal!important;}

/* インデント */
.t-ind{ padding-left:1em; text-indent:-1em;}

/* 行そろえ */
.t-center{ text-align:center;}
.t-left{ text-align:left;}
.t-right{ text-align:right;}

/* 改行 */
.br::before {
	content: "\A";
	white-space: pre;
}
@media screen and (max-width:768px){
	.br-sp::before {
		content: "\A";
		white-space: pre;
	}
}


/* none */
@media screen and (min-width:769px){ .sponly{ display:none!important;}}
@media screen and (max-width:768px){ .pconly{ display:none!important;}}
.hidden {display: none;}

/* imgalpha */
a.imgalpha:hover{ opacity: 0.6;}
a:hover img.imgalpha{ opacity: 0.6;}

/* tablewrap */
.tablewrap{ }
@media screen and (max-width:768px){
	.tablewrap{ overflow: auto; white-space: nowrap;}
	.tablewrap::-webkit-scrollbar{ height: 5px;}
	.tablewrap::-webkit-scrollbar-track{ background: #F1F1F1;}
	.tablewrap::-webkit-scrollbar-thumb { background: #BCBCBC;}
	.tablewrap table{ width: 100%;}
}

/* フォーム */
label{
	cursor: pointer;
}
input {
	font-size:  16px;
}
input[type="radio"], input[type="checkbox"]{
	margin-right: .5em;
	margin-bottom: 3px;
	vertical-align: middle;
}
input[type="text"],
input[type="password"],
input[type="button"],
input[type="submit"],
input[type="email"],
input[type="tel"]{
	box-sizing: border-box;
	width: 100%;
	height: 30px;
	line-height: 30px;
	padding: 0 1em;
    -webkit-appearance: none!important;
}
input[type="button"],
input[type="submit"]{
	box-sizing: border-box;
	width: 100%;
	height: 30px;
	line-height: 30px;
	padding: 0 1em;
	display: inline-block;
	width: auto;
}
input[type="email"], input[type="text"] {
    box-sizing: border-box;
    padding: 1em 0.5em;
    outline: none;
    -webkit-appearance: none!important;
    font-family:  "Meiryo", "Hiragino Sans";/*WindowsのChromeでテキストエリアの文字が小さくなるのを防ぐ*/
    border: 1px solid var(--line2);
    border-radius: 4px;
}
select {
    appearance: none;
    position: relative;
	box-sizing: border-box;
	height: 30px;
	line-height: 30px;
	padding: 0 1em;
	cursor: pointer;
    -webkit-appearance: none!important;
    border: 1px solid var(--line2);
    color: var(--base);
    border-radius: 5px;
    height: auto;
    background:var(--white) url(../images/arrow-down.svg) no-repeat right 10px center / 16px auto;
}
select option {
	padding: .2em 0!important;
	font-size: var(--midium)!important;
}
select option:hover {
	background-color: var(--key-l)!important;
}

textarea {
	box-sizing: border-box;
	width: 100%;
	height: 200px;
	padding: 1em;
	outline: none;
    -webkit-appearance: none!important;
    font-family:  "Meiryo", "Hiragino Sans";/*WindowsのChromeでテキストエリアの文字が小さくなるのを防ぐ*/
    border: 1px solid var(--line2);
    border-radius: 5px;
}
button{
	background: none;
	border: none;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}
/* googlemap */
.gmap {
	height: 0;
	overflow: hidden;
	padding-bottom: 40%;
	position: relative;
}
.gmap iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width:768px){
	.gmap {
		padding-bottom: 60%;
	}
}


/* margin */
.mb05em{ margin-bottom: .5em!important;}
.mb1em{ margin-bottom: 1em!important;}
.mb2em{ margin-bottom: 2em!important;}
.mb3em{ margin-bottom: 3em!important;}
.mb4em{ margin-bottom: 4em!important;}
.mb5em{ margin-bottom: 5em!important;}
.mt05em{ margin-top: .5em!important;}
.mt1em{ margin-top: 1em!important;}
.mt2em{ margin-top: 2em!important;}
.mt3em{ margin-top: 3em!important;}
.mt4em{ margin-top: 4em!important;}
.mt5em{ margin-top: 5em!important;}
.ml05em{ margin-left: .5em!important;}
.ml1em{ margin-left: 1em!important;}
.ml2em{ margin-left: 2em!important;}
.ml3em{ margin-left: 3em!important;}
.ml4em{ margin-left: 4em!important;}
.ml5em{ margin-left: 5em!important;}
.mr05em{ margin-right: .5em!important;}
.mr1em{ margin-right: 1em!important;}
.mr2em{ margin-right: 2em!important;}
.mr3em{ margin-right: 3em!important;}
.mr4em{ margin-right: 4em!important;}
.mr5em{ margin-right: 5em!important;}