@charset "utf-8";

@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');


/*---------------------------------------------
reset
---------------------------------------------*/
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
font-size: 100%;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size:1rem;
	font: inherit;
}
h1, h2, h3, h4, h5, h6 { font-size:1rem; font-weight:normal; }
table, th, td { border-collapse:collapse;border-spacing:0;}
th , td { word-wrap:break-word; }
ol li, ul li { list-style:none; }
img { border:0; vertical-align:bottom; }
input, textarea { vertical-align:middle; }
address, em { font-style:normal; }

/*---------------------------------------------
Common Style
---------------------------------------------*/
html { font-size: 62.5%; }

body { font-family:'Noto Sans JP', "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", 'Noto Sans JP',"游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif; line-height: 1.6; height: 100%; text-align: left; margin:0; padding:0; color:#333; -webkit-text-size-adjust:100%; }

body {
position: relative;
height: 100%;
display: flex;
flex-direction: column;
overflow-x:hidden;
}

:root {
--white:#FFFFFF;
--gray_33:#333;
--gray_55:#555;
--gray_66:#666;
--gray_99:#999;
--gray_cc:#CCCCCC;
--gray_dd:#DDDDDD;
--gray_ee:#EEEEEE;
--gray_f0:#F0F0F0;
--black:#000000;
--light-orange:#fbd6b2; 
--pale-orange:#f9d9b9;
--pale-orange2:#FFF3E0;
--pale-orange3:#FFE0B2;
--orange:#F07800;
--pale-green:#E2F2EC;
--light-green:#dfefe8;
--green:#4FAC80;
--deep-green:#18723f;
--light-blue:#C7E9FA;
--blue:#0092D6;
--pale-blue:#e5f4fb;
--light-yellow:#fcf4be;
--yellow:#F9DA0C;
--beige:#FFF6E5;
--pale-turquoise:#ebfafb;
--light-turquoise:#90cacf;
--turquoise:#39A3AC;
--pale-pink:#fff5f6;
--light-pink:#FFCED2;
--light-pink-shadow:#D88888;
--pink:#f05f6c;
--pale_chamois:#FFF8ED;
--pale-teal:#E0F2F1;
--teal:#26A69A;
--light-purple:#ECE4F3;
--purple:#75519A;
--light-mos-green:#edf6df;
--mos-green:#728E4A;
--light-wine-red:#fdf5f5;
--wine-red:#C46262;
--deep-red:#cc0000;
--red:#e7231b;
--light-nile-blue:#E4EEED;
--nile-blue:#4D8D87;
--light-chamois:#FFF8ED;
--chamois:#D3941F;
--pale-brown:#FFE6BB;
--light-brown:#c8b188;
--brown:#A78D79;
--brown-shadow:#886C56;
--light-gold:#FFF8ED;
--gold:#ab8f38;
--at:#C2185B;
--mt:#1976D2;
--mt-motor:#00897B;
--elder:#75519A;
--elder-pale:#ECE4F3;
--paper-driver:#728E4A;
--paper-driver-pale:#edf6df;
--paper-rider:#C46262;
--paper-rider-pale:#fdf5f5;
--safety:#4D8D87;
--safety-pale:#E4EEED;
--safety-corp:#D3941F;
--safety-corp-pale:#FFF8ED;
--link-color:#3399cc;
--bg-hover-color:#FAE97D;
--icon: "Font Awesome 6 Pro";
--min-width:1080px;
--max-width:1080px;
}

/*---------------------------------------------
Layout Style
---------------------------------------------*/
/*--- padding ---*/
.p-0 { padding:0; }
.p-3 { padding:3px; }
.p-5 { padding:5px; }
.p-10 { padding:10px; }
.p-15 { padding:15px; }
.p-20 { padding:20px; }
.p-25 { padding:25px; }
.p-30 { padding:30px; }
.p-40 { padding:40px; }
.p-50 { padding:20px; }

.p-0-5-5 { padding:0 5px 5px; }
.p-0-20-20 { padding:0 20px 20px; }
.p-0-30-30 { padding:0 30px 30px; }
.p-10-15 { padding:10px 15px; }
.p-15-20 { padding:15px 20px; }
.p-20-20-0 { padding:20px 20px 0; }
.p-20-15 { padding:20px 15px; }
.p-25-30-30 { padding:25px 30px 30px; }
.p-30-30-0 { padding:30px 30px 0; }
.p-30-50-50 { padding:30px 50px 50px; }

.pt-3 { padding-top:3px; }
.pt-5 { padding-top:5px; }
.pt-15 { padding-top:15px; }
.pt-20 { padding-top:20px; }
.pt-25 { padding-top:25px; }
.pt-30 { padding-top:30px; }
.pt-35 { padding-top:35px; }
.pt-40 { padding-top:40px; }

.pb-15 { padding-bottom:15px; }
.pb-20 { padding-bottom:20px; }
.pb-25 { padding-bottom:25px; }

.pl-20 { padding-left:20px; }
.pl-30 { padding-left:30px; }
.pl-40 { padding-left:40px; }
.pl-50 { padding-left:50px; }
.pl-70 { padding-left:70px; }
.pl-80 { padding-left:80px; }
.pl-90 { padding-left:90px; }
.pl-100 { padding-left:100px; }

/*--- margin ---*/
.m-0 { margin:0; }
.margin-0-auto { margin:0 auto; }
.mt-10 { margin-top:10px; }
.mt-20 { margin-top:20px; }

/*--- box-shadow ---*/
.has-box-shadow { box-shadow: 0 3px 0 var(--gray_dd); }
.has-box-shadow:hover { box-shadow: 0 3px 0 #b9ab53; }
.has-box-shadow.bg-light-yellow { box-shadow:0 3px 0 #b9ab53; }
.has-box-shadow.bg-light-yellow:hover { box-shadow: 0 3px 0 #b9ab53; }

/*--- border ---*/
.border-bottom-1 { border-bottom:1px; border-style:solid; }

.menu-border-color { border-color:#e5d473; }

/*--- color ---*/
.color-at { color:var(--at) };
.color-mt { color:var(--mt); }
.color-mt { color:var(--mt-motor); }
.color-white{ color:var(--white); }
.color-red { color:#F85353; }
.color-deep-red { color:#CC0000; }
.color-gray-cc { color:var(--gray_cc); }
.color-gray-dd { color:var(--gray_dd); }
.color-gray-f0 { color:var(--gray_f0); }
.color-gray-33 { color:var(--gray_33); }
.color-gray-66 { color:var(--gray_66); }
.color-gray-99 { color:var(--gray_99); }
.color-light-pink { color:var(--light-pink); }
.color-pink { color:var(--pink); }
.color-turquoise { color:var(--turquoise); }
.color-orange { color:var(--orange); }
.color-purple { color:var(--purple); }
.text-white { color:var(--white); }

/*--- background-color ---*/
.bg-white { background-color:var(--white); }
.bg-gray-33 { background-color:var(--gray_33); }
.bg-gray-66 { background-color:var(--gray_66); }
.bg-gray-99 { background-color:var(--gray_99); }
.bg-gray-cc { background-color:var(--gray_cc); }
.bg-gray-dd { background-color:var(--gray_dd); }
.bg-gray-ee  { background-color:var(--gray_ee); }
.bg-gray-f0 { background-color:var(--gray_f0); }

.bg-light-orange { background-color:var(--light-orange); }
.bg-orange { background-color:var(--orange); }
.bg-pale-green { background-color:var(--pale-green); }
.bg-light-green { background-color:var(--light-green); }
.bg-green { background-color:var(--green); }
.bg-beige { background-color:var(--beige); }
.bg-light-yellow { background-color:var(--light-yellow); }
.bg-yellow { background-color:var(--yellow); }
.bg-pale-blue { background-color:var(--pale-blue); }
.bg-blue { background-color:var(--blue); }
.bg-light-blue { background-color:var(--light-blue); }
.bg-pink { background-color:var(--pink); }
.bg-pale-pink { background-color:var(--pale-pink); }
.bg-red { background-color:var(--red); }
.bg-pale-turquoise { background-color:var(--pale-turquoise); }
.bg-light-turquoise { background-color:var(--light-turquoise); }
.bg-turquoise { background-color:var(--turquoise); }
.bg-pale-teal { background-color:var(--pale-teal); }
.bg-teal { background-color:var(--teal); }
.bg-light-gold { background-color:var(--light-gold); }
.bg-gold { background-color:var(--gold); }
.bg-light-mos-green { background-color:var(--light-mos-green); }
.bg-pale-orange { background-color:var(--pale-orange); }
.bg-pale-orange2 { background-color:var(--pale-orange2); }
.bg-pale-orange3 { background-color:var(--pale-orange3); }
.bg-pale-chamois { background-color:var(--pale_chamois); }
.bg-light-purple { background-color:var(--light-purple); }
.bg-black { background-color:var(--black); }

.hover-color-orange:hover { color:var(--orange); }
.bg-hover-color:hover { background-color:var(--bg-hover-color); }

/*--- category-background-color ---*/
.bg-color-at { background-color:var(--at); }
.bg-color-mt { background-color:var(--mt); }
.bg-color-mt-motor { background-color:var(--mt-motor); }
.bg-color-elder { background-color:var(--elder); }
.bg-color-elder-pale { background-color:var(--elder-pale); }
.bg-color-paper-driver { background-color:var(--paper-driver); }
.bg-color-paper-driver-pale { background-color:var(--paper-driver-pale); }
.bg-color-paper-rider { background-color:var(--paper-rider); }
.bg-color-paper-rider-pale { background-color:var(--paper-rider-pale); }
.bg-color-safety { background-color:var(--safety); }
.bg-color-safety-pale { background-color:var(--safety-pale); }
.bg-color-safety-corp { background-color:var(--safety-corp); }
.bg-color-safety-corp-pale { background-color:var(--safety-corp-pale); }

/*--- font-weight ---*/
strong { font-weight:600; }
.weight-400 { font-weight:400; }
.weight-600 { font-weight:600; }
.weight-700 { font-weight:700; }

/*--- font-size ---*/
.font-xs { font-size:0.8rem; }
.font-s { font-size:0.9rem; }
.font-m { font-size:1.0rem; }
.font-l { font-size:1.2rem; }
.font-xl { font-size:1.4rem; }

.font-8 { font-size:0.8rem; }
.font-9 { font-size:0.9rem; }
.font-10 { font-size:1.0rem; }
.font-11 { font-size:1.1rem; }
.font-12 { font-size:1.2rem; }
.font-13 { font-size:1.3rem; }
.font-14 { font-size:1.4rem; }
.font-15 { font-size:1.5rem; }
.font-16 { font-size:1.6rem; }
.font-17 { font-size:1.7rem; }
.font-18 { font-size:1.8rem; }
.font-19 { font-size:1.9rem; }
.font-20 { font-size:2.0rem; }
.font-21 { font-size:2.1rem; }
.font-22 { font-size:2.2rem; }
.font-23 { font-size:2.3rem; }
.font-24 { font-size:2.4rem; }
.font-26 { font-size:2.6rem; }
.font-28 { font-size:2.8rem; }
.font-30 { font-size:3.0rem; }
.font-32 { font-size:3.2rem; }
.font-34 { font-size:3.4rem; }

/*--- font-family ---*/
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }

/*--- line-height ---*/
.line-height-10 { line-height:1.0; }
.line-height-12 { line-height:1.2; }
.line-height-14 { line-height:1.4; }
.line-height-16 { line-height:1.6; }
.line-height-18 { line-height:1.8; }
.line-height-20 { line-height:2.0; }
.line-height-24 { line-height:2.4; }

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

/*--- flex ---*/
.di-flex { display:flex; }
.di-grid { display:grid; }
.di-none { display:none; }

.align-center { align-items:center; }

.justify-around { justify-content:space-around; }
.justify-start { justify-content:start; }
.justify-center { justify-content:center; }
.justify-between { justify-content:space-between; }
.justify-end { justify-content:flex-end }

.flex-wrap { flex-wrap:wrap; }

.fd-column { flex-direction:column; }
.fd-unset { flex-direction:unset; }

.flex-1 { flex:1; }
.flex-grow-1 { flex-grow:1; }

/*--- gap ---*/
.gap-10 { gap:10px; }

.column-gap-5 { gap:5px; }
.column-gap-10 { gap:10px; }
.column-gap-15 { gap:15px; }
.column-gap-20 { gap:20px; }

.row-gap-5 { row-gap:5px; }
.row-gap-10 { row-gap:10px; }
.row-gap-15 { row-gap:15px; }
.row-gap-20 { row-gap:20px; }
.row-gap-25 { row-gap:25px; }
.row-gap-30 { row-gap:30px; }
.row-gap-40 { row-gap:40px; }
.row-gap-50 { row-gap:50px; }
.row-gap-60 { row-gap:60px; }

.grid-gap-5 { grid-gap:5px; }
.grid-gap-10 { grid-gap:10px; }
.grid-gap-15 { grid-gap:15px; }
.grid-gap-20 { grid-gap:20px; }
.grid-gap-25 { grid-gap:25px; }
.grid-gap-30 { grid-gap:30px; }
.grid-gap-40 { grid-gap:40px; }
.grid-gap-50 { grid-gap:50px; }
.grid-gap-60 { grid-gap:60px; }

/*--- width-style ---*/
.w-15p { width:15%; }
.w-20p { width:20%; }
.w-25p { width:25%; }
.w-30p { width:30%; }
.w-50p { width:50%; }
.w-100p { width:100%; }
.w-200px { width:200px; }
.w-320px { width:320px; }

.min-width-100 { min-width:100px; }
.min-width-200 { min-width:200px; }
.min-width-300 { min-width:300px; }
.min-width-400 { min-width:400px; }
.min-width-600 { min-width:600px; }
.min-width-800 { min-width:800px; }
.min-width-1000 { min-width:1000px; }

.max-width-20 { max-width:20px; }
.max-width-30 { max-width:30px; }
.max-width-50 { max-width:50px; }
.max-width-100 { max-width:100px; }
.max-width-120 { max-width:120px; }
.max-width-140 { max-width:140px; }
.max-width-160 { max-width:160px; }
.max-width-180 { max-width:180px; }
.max-width-200 { max-width:200px; }
.max-width-220 { max-width:220px; }
.max-width-240 { max-width:240px; }
.max-width-260 { max-width:260px; }
.max-width-280 { max-width:280px; }
.max-width-300 { max-width:300px; }
.max-width-320 { max-width:320px; }

.max-width-10vw { max-width:10vw; }
.max-width-15vw { max-width:15vw; }

/*--- height-style ---*/
.h-100p { height:100%; }

.max-height-14 { max-height:14px; }
.max-height-16 { max-height:16px; }
.max-height-18 { max-height:18px; }
.max-height-20 { max-height:20px; }
.max-height-30 { max-height:30px; }
.max-height-32 { max-height:32px; }
.max-height-34 { max-height:34px; }
.max-height-36 { max-height:36px; }
.max-height-38 { max-height:38px; }
.max-height-40 { max-height:40px; }
.max-height-50 { max-height:50px; }
.max-height-90 { max-height:90px; }
.max-height-100 { max-height:100px; }
.max-height-150 { max-height:150px; }
.max-height-200 { max-height:200px; }
.max-height-300 { max-height:300px; }

/*--- position-style ---*/
.po-relative { position:relative; }
.po-absolute { position:absolute; }

.right-15 { right:15px; }
.bottom-0 { bottom:0; }
.bottom-15 {  bottom:15px; }

/*--- image-position-style ---*/
.object-position-y-20 { object-position:center 20% !important; }
.object-position-y-30 { object-position:center 30% !important; }
.object-position-y-40 { object-position:center 40% !important; }
.object-position-y-50 { object-position:center 50% !important; }
.object-position-y-60 { object-position:center 60% !important; }
.object-position-y-70 { object-position:center 70% !important; }
.object-position-y-80 { object-position:center 80% !important; }

/*--- border-radius-style ---*/
.rd-6 { border-radius:6px; }
.rd-0-0-6-6 { border-radius:0 0 6px 6px; }
.rd-6-6-0-0 { border-radius:6px 6px 0 0; }

/*--- border-color-style ---*/
.border-1-gray-ee { border:1px solid var(--gray_ee); }
.border-1-gray-cc { border:1px solid var(--gray_cc); }
.border-right-1-gray-cc { border-right:1px solid var(--gray_cc); }

/*--- overflow-style ---*/

.overflow-hidden,
.overflow:hidden {

}

.overflow-x-hidden,
.overflow-x:hidden {

}

.overflow-y-hidden,
.overflow-y:hidden {

}

.overflow-x-scroll,
.overflow-x:scroll {

}