@charset "utf-8";
/****************************************
               Reset CSS
*****************************************/
/*
html5doctor.com Reset Stylesheet
v1.4
2009-07-27
Author: Richard Clark - http://richclarkdesign.com
*/
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;
}
body {
    line-height:1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section{
    display:block;
}

nav ul li{
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    transition: all 0.3s;
}

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;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
input:focus {
    outline: none;
}

/****************************************
                Common
*****************************************/
*{
    font-display: swap;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}
*::-webkit-scrollbar{
    display:none;
}
*,*:before,*:after{
    font-display: swap;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}
*::-webkit-scrollbar{
    display:none;
}

div{-webkit-tap-highlight-color: rgba(0,0,0,0);}

a {
    color:#000;
    -webkit-tap-highlight-color: rgba(0,0,0,0); /* タップ時の背景色 */
    text-decoration:none;
    transition: all 0.3s;
    outline:none;
}
a.ul{
    text-decoration: underline;
}

li{list-style: none!important;}

.block{display:block!important;}
.iblock{display:inline-block!important;}
.hide{display:none!important;}

.clearfix {min-height: 1px;}
* html .clearfix {
    height: 1px;
    height: auto;
    overflow: hidden;
}
.clearfix:after {
    display:block;
    clear:both;
    height:0px;
    visibility:hidden;
    content:".";
}

.color-rd{color: #CC0000;}
.color-gr{color: #0A8647;}
.color-as{color: #8D928F;}

.relative{position:relative;}
.absolute{position:absolute;}

/****************************************
         position
*****************************************/
.p-r{position:relative;}
.p-a{position:absolute;}
.p-f{position:fixed;}

/****************************************
        text
*****************************************/
.f10{font-size:10px;}
.f11{font-size:11px;}
.f12{font-size:12px;}
.f14{font-size:14px;}
.f16{font-size:16px;}
.f18{font-size:18px;}
.f20{font-size:20px;}
.f24{font-size:24px;}
.f28{font-size:28px;}
.f28{font-size:32px;}

.lh100{line-height:1em}
.lh120{line-height:1.2em}
.lh140{line-height:1.4em}
.lh150{line-height:1.5em}
.lh200{line-height:2em}

.tc{text-align:center!important;}
.tl{text-align:left!important;}
.tr{text-align:right!important;}

.fwbold{font-weight: bold;}

.vtop{vertical-align: top;}
.vmid{vertical-align: middle;}
.vbtm{vertical-align: bottom;}

/****************************************
        size
*****************************************/
.w5{width:5%!important;}
.w10{width:10%!important;}
.w14{width:calc(100% / 7)!important;}
.w15{width:15%!important;}
.w16{width:calc(100% / 6)!important;}
.w20{width:20%!important;}
.w25{width:25%!important;}
.w30{width:30%!important;}
.w33{width:calc(100% / 3)!important;}
.w35{width:35%!important;}
.w40{width:40%!important;}
.w45{width:45%!important;}
.w50{width:50%!important;}
.w55{width:55%!important;}
.w60{width:60%!important;}
.w65{width:60%!important;}
.w66{width:calc(100% / 3 * 2)!important;}
.w70{width:70%!important;}
.w75{width:75%!important;}
.w80{width:80%!important;}
.w85{width:85%!important;}
.w90{width:90%!important;}
.w95{width:95%!important;}
.w100{width:100%!important;}

.ws80{width:80px;}
.ws100{width:100px;}
.ws120{width:120px;}
.ws140{width:140px;}
.ws180{width:180px;}
.ws240{width:240px;}
.ws320{width:320px;}

.h4{height:4rem!important;}
.h8{height:8px!important;}
.h10{height:20rem!important;}
.h100{height:100%!important;}

.mh90{min-height: 90px;}

/****************************************
         margin/padding
*****************************************/
.ma{margin-right:auto;margin-left:auto;}

.m2{margin-top:2px;margin-bottom:2px;}
.m4{margin-top:4px;margin-bottom:4px;}
.m6{margin-top:6px;margin-bottom:6px;}
.m8{margin-top:8px;margin-bottom:8px;}
.m10{margin-top:10px;margin-bottom:10px;}
.m16{margin-top:16px;margin-bottom:16px;}
.m20{margin-top:20px;margin-bottom:20px;}
.m24{margin-top:24px;margin-bottom:24px;}
.m32{margin-top:32px;margin-bottom:32px;}

.ms2{margin-right:2px;margin-left:2px;}
.ms4{margin-right:4px;margin-left:4px;}
.ms6{margin-right:6px;margin-left:6px;}
.ms8{margin-right:8px;margin-left:8px;}
.ms10{margin-right:10px;margin-left:10px;}
.ms16{margin-right:16px;margin-left:16px;}
.ms20{margin-right:20px;margin-left:20px;}
.ms24{margin-right:24px;margin-left:24px;}
.ms32{margin-right:32px;margin-left:32px;}

.mt2{margin-top:2px!important;}
.mt4{margin-top:4px!important;}
.mt6{margin-top:6px!important;}
.mt8{margin-top:8px!important;}
.mt10{margin-top:10px!important;}
.mt16{margin-top:16px!important;}
.mt20{margin-top:20px!important;}
.mt24{margin-top:24px!important;}
.mt32{margin-top:32px!important;}

.mb0{margin-bottom:0px!important;}
.mb1{margin-bottom:1px!important;}
.mb2{margin-bottom:2px!important;}
.mb4{margin-bottom:4px!important;}
.mb6{margin-bottom:6px!important;}
.mb8{margin-bottom:8px!important;}
.mb10{margin-bottom:10px!important;}
.mb16{margin-bottom:16px!important;}
.mb20{margin-bottom:20px!important;}
.mb24{margin-bottom:24px!important;}
.mb32{margin-bottom:32px!important;}

.mr2{margin-right:2px!important;}
.mr4{margin-right:4px!important;}
.mr6{margin-right:6px!important;}
.mr8{margin-right:8px!important;}
.mr10{margin-right:10px!important;}
.mr16{margin-right:16px!important;}
.mr20{margin-right:20px!important;}
.mr24{margin-right:24px!important;}
.mr32{margin-right:32px!important;}


.pa2{padding:2px;}
.pa4{padding:4px;}
.pa6{padding:6px;}
.pa8{padding:8px;}
.pa10{padding:10px;}
.pa16{padding:16px;}
.pa20{padding:20px;}
.pa24{padding:24px;}
.pa32{padding:32px;}

.parem1{padding: 0.75rem;}
.parem2{padding: 1rem;}
.parem3{padding: 1.25rem;}

.p2{padding-top:2px;padding-bottom:2px;}
.p4{padding-top:4px;padding-bottom:4px;}
.p6{padding-top:6px;padding-bottom:6px;}
.p8{padding-top:8px;padding-bottom:8px;}
.p10{padding-top:10px;padding-bottom:10px;}
.p16{padding-top:16px;padding-bottom:16px;}
.p20{padding-top:20px;padding-bottom:20px;}
.p24{padding-top:24px;padding-bottom:24px;}
.p32{padding-top:32px;padding-bottom:32px;}

.ps2{padding-left:2px;padding-right:2px;}
.ps4{padding-left:4px;padding-right:4px;}
.ps6{padding-left:6px;padding-right:6px;}
.ps8{padding-left:8px;padding-right:8px;}
.ps10{padding-left:10px;padding-right:10px;}
.ps16{padding-left:16px;padding-right:16px;}
.ps17{padding-left:17px;padding-right:17px;}
.ps20{padding-left:20px;padding-right:20px;}
.ps24{padding-left:24px;padding-right:24px;}
.ps32{padding-left:32px;padding-right:32px;}

.pt2{padding-top:2px!important;}
.pt4{padding-top:4px!important;}
.pt6{padding-top:6px!important;}
.pt8{padding-top:8px!important;}
.pt10{padding-top:10px!important;}
.pt16{padding-top:16px!important;}
.pt20{padding-top:20px!important;}
.pt24{padding-top:24px!important;}
.pt32{padding-top:32px!important;}

.pb2{padding-bottom:2px!important;}
.pb4{padding-bottom:4px!important;}
.pb6{padding-bottom:6px!important;}
.pb8{padding-bottom:8px!important;}
.pb10{padding-bottom:10px!important;}
.pb16{padding-bottom:16px!important;}
.pb20{padding-bottom:20px!important;}
.pb20{padding-bottom:24px!important;}
.pb32{padding-bottom:32px!important;}

.flex {display: flex;}
.flex_col {flex-direction: column;}
.justify_row {justify-content: row;}
.justify_between {justify-content: space-between;}
.justify_column {justify-content: column;}
.justify_reverse {justify-content: column-reverse;}
.justify_left {justify-content: flex-start;}
.justify_center {justify-content: center;}
.justify_right {justify-content: flex-end;}

.items_center {align-items: center;}

.grid_cols1 {display: grid; grid-template-columns: repeat(1, minmax(0, 1fr));}
.grid_cols2 {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));}
.grid_cols3 {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));}
.grid_cols4 {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));}
.grid_cols5 {display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));}
.grid_cols6 {display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));}
.grid_cols7 {display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));}
.grid_cols8 {display: grid; grid-template-columns: repeat(8, minmax(0, 1fr));}

.gap1 {gap: 1rem;}
.gap2 {gap: 1.2rem;}
.gap3 {gap: 1.3rem;}
.gap4 {gap: 1.4rem;}
.gap5 {gap: 1.5rem;}
.gap6 {gap: 1.6rem;}
.gap7 {gap: 1.7rem;}
.gap8 {gap: 1.8rem;}

.col_span2 {grid-column: span 2 / span 2;}
.col_span3 {grid-column: span 3 / span 3;}
.col_span4 {grid-column: span 4 / span 4;}
.col_span5 {grid-column: span 5 / span 5;}
.col_span6 {grid-column: span 6 / span 6;}
.col_span7 {grid-column: span 7 / span 7;}
.col_span8 {grid-column: span 8 / span 8;}

.bg_gray {background-color: #EEEEEE;}
.bg_gray200 {background-color: #E5E7EB;}
.text_gray300 {color: #d5d1db;}

.text-xs {
    font-size: 0.75rem;
    line-height: 1rem;
}

/****************************************
                button
*****************************************/
/* btn width size */
.btn_s_ss{width: 64px;}
.btn_s_s{width: 180px;}
.btn_s_m{width: 210px;}
.btn_s_l{width: 300px;}
.btn_s_20{width: 20%;}
.btn_s_40{width: 40%;}
.btn_s_50{width: 50%;}
.btn_s_60{width: 60%;}
.btn_s_80{width: 80%;}
.btn_s_100{width: 100%;}

/* btn height size */
.btn_h_ll{height: 20px;font-size: 10px;font-weight: bold;line-height: 20px;}
.btn_h_l{height: 28px;font-size: 11px;font-weight: bold;line-height: 28px;}
.btn_h_m{height: 40px;}
.btn_h_h{height: 60px;}

/* btn position */
.btn_p_c{margin-right:auto;margin-left:auto;}
.btn_p_l{margin-right:auto;margin-left:0px;}
.btn_p_r{margin-right:0px;margin-left:auto;}


/****************************************
                box-shadow
*****************************************/
.box_shadow{box-shadow: 1px 1px 2px rgba(0,0,0,0.6)}

/****************************************
                border
*****************************************/
.border{border:solid 1px;}
.border_top{border-top:solid 1px;}
.border_left{border-left:solid 1px;}
.border_right{border-right:solid 1px;}
.border_bottom{border-bottom:solid 1px;}

.border_blue{border-color:#2563eb;}
.border_green{border-color:#4ade80;}
.border_cyan{border-color:#06B6D4;}
.border_yellow{border-color:#FACC14;}

.border_w_1 {border-width: 1px!important;}
.border_w_2 {border-width: 2px!important;}
.border_w_3 {border-width: 3px!important;}
.border_w_4 {border-width: 4px!important;}

.rounded {border-radius: 4px;}

.text-overflow {text-overflow: ellipsis;}
