@charset 'UTF-8';

/*

    Reset and element defaults (manage screens)

*/

*, *::before, *::after { box-sizing: border-box;}
html { font-size: 8px; -webkit-text-size-adjust: 100%;}
body { margin: 0; font-family: 'Yu Gothic', 'YuGothic', 'Meiryo', 'メイリオ', 'Hiragino Kaku Gothic ProN', sans-serif; font-size: 1.6rem; line-height: 1.6; color: var(--text-color); background: var(--background-color); -webkit-font-smoothing: antialiased;}
h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd, figure, blockquote { margin: 0; padding: 0;}
ul, ol { list-style: none;}
a { color: var(--link-color); text-decoration: none; transition: all 0.1s linear;}
a:hover { opacity: 0.7;}
img, svg, iframe { max-width: 100%; vertical-align: middle;}
table { border-collapse: collapse; border-spacing: 0; width: 100%;}
th, td { text-align: left; vertical-align: middle;}
button, input, select, textarea { font: inherit; color: inherit; margin: 0;}
input, select, textarea { border: 1px #cfd8e6 solid; border-radius: 10px; background: #ffffff; padding: 10px 12px; min-height: 46px; font-size: 1.6rem; width: 100%; max-width: 100%; -webkit-appearance: none; appearance: none;}
input[type="checkbox"], input[type="radio"] { width: auto; min-height: 0; -webkit-appearance: auto; appearance: auto; padding: 0; margin: 0 0.4em 0 0; vertical-align: middle;}
input[type="file"] { padding: 0.4em; border-style: dashed;}
select { background: #ffffff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475467' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 0.6em center / 1.2em; padding-right: 2.2em;}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--focus-color); outline-offset: 1px; border-color: var(--main-color);}
input[readonly], input:disabled, select:disabled, textarea:disabled { background: #f2f4f7; color: #667085; border-color: #e4e7ec;}
textarea { resize: vertical; min-height: 5em;}
button { cursor: pointer; background: none; border: none; padding: 0;}
hr { border: 0; border-top: 1px #d8e0ea solid; margin: 1.5em 0;}
small { font-size: 0.85em;}
code { font-family: Menlo, Consolas, monospace; font-size: 0.9em; background: #f1f3f6; padding: 0.1em 0.4em; border-radius: 4px;}
strong { font-weight: 700;}

@media screen and (min-width: 768px) {
	html { font-size: 10px;}
}
[hidden] { display: none !important;}
