@charset "UTF-8";

/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
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;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
table{
	border-collapse: collapse;
}
table th,
table td{
    padding: 5px;
}
/* css reset end */

/************************************************************/
/*   :root   */
/************************************************************/
/* フォントサイズ */
@media screen and (max-width:599px) { /*SP（430px基準）*/
    :root {
        --f10: 2.33vw;
        --f11: 2.56vw;
        --f12: 2.79vw;
        --f13: 3.02vw;
        --f14: max(12px, 3.26vw);
        --f15: max(12px, 3.49vw);
        --f16: max(12px, 3.72vw);
        --f17: max(12px, 3.95vw);
        --f18: max(12px, 4.19vw);
        --f19: 4.42vw;
        --f20: 4.65vw;
        --f21: 4.88vw;
        --f22: 5.12vw;
        --f23: 5.35vw;
        --f24: 5.58vw;
        --f25: 5.81vw;
        --f26: 6.05vw;
        --f27: 6.28vw;
        --f28: 6.51vw;
        --f29: 6.74vw;
        --f30: 6.98vw;
        --f31: 7.21vw;
        --f32: 7.44vw;
        --f33: 7.67vw;
        --f34: 7.91vw;
        --f35: 8.14vw;
        --f36: 8.37vw;
        --f37: 8.60vw;
        --f38: 8.84vw;
        --f39: 9.07vw;
        --f40: 9.30vw;
        --f41: 9.53vw;
        --f42: 9.77vw;
        --f43: 10.00vw;
        --f44: 10.23vw;
        --f45: 10.47vw;
        --f46: 10.70vw;
        --f47: 10.93vw;
        --f48: 11.16vw;
        --f49: 11.40vw;
        --f50: 11.63vw;
        --f60: 13.95vw;
    }
}
@media screen and (min-width:600px) { /*PC（1260px基準）*/
    :root {
        --f10: min(0.79vw, 10px);
        --f11: min(0.87vw, 11px);
        --f12: clamp(12px, 0.95vw, 12px);
        --f13: clamp(12px, 1.03vw, 13px);
        --f14: clamp(12px, 1.11vw, 14px);
        --f15: clamp(12px, 1.19vw, 15px);
        --f16: clamp(12px, 1.27vw, 16px);
        --f17: clamp(12px, 1.35vw, 17px);
        --f18: clamp(12px, 1.43vw, 18px);
        --f19: clamp(12px, 1.51vw, 19px);
        --f20: clamp(12px, 1.59vw, 20px);
        --f21: clamp(12px, 1.67vw, 21px);
        --f22: clamp(12px, 1.75vw, 22px);
        --f23: clamp(12px, 1.83vw, 23px);
        --f24: clamp(12px, 1.90vw, 24px);
        --f25: clamp(12px, 1.98vw, 25px);
        --f26: min(2.06vw, 26px);
        --f27: min(2.14vw, 27px);
        --f28: min(2.22vw, 28px);
        --f29: min(2.30vw, 29px);
        --f30: min(2.38vw, 30px);
        --f31: min(2.46vw, 31px);
        --f32: min(2.54vw, 32px);
        --f33: min(2.62vw, 33px);
        --f34: min(2.70vw, 34px);
        --f35: min(2.78vw, 35px);
        --f36: min(2.86vw, 36px);
        --f37: min(2.94vw, 37px);
        --f38: min(3.02vw, 38px);
        --f39: min(3.10vw, 39px);
        --f40: min(3.17vw, 40px);
        --f41: min(3.25vw, 41px);
        --f42: min(3.33vw, 42px);
        --f43: min(3.41vw, 43px);
        --f44: min(3.49vw, 44px);
        --f45: min(3.57vw, 45px);
        --f46: min(3.65vw, 46px);
        --f47: min(3.73vw, 47px);
        --f48: min(3.81vw, 48px);
        --f49: min(3.89vw, 49px);
        --f50: min(3.97vw, 50px);
        --f60: min(4.76vw, 60px);
    }
}

/********** FONT **********/
/* Noto Serif / Noto Sans 共通 */
.fw-t  { font-weight: 100; } /* Thin */
.fw-el { font-weight: 200; } /* ExtraLight */
.fw-l  { font-weight: 300; } /* Light */
.fw-r  { font-weight: 400; } /* Regular */
.fw-m  { font-weight: 500; } /* Medium */
.fw-sb { font-weight: 600; } /* SemiBold */
.fw-b  { font-weight: 700; } /* Bold */
.fw-eb { font-weight: 800; } /* ExtraBold */
.fw-bl { font-weight: 900; } /* Black */

.serif{
    font-family: "Noto Serif JP",
             "Hiragino Mincho ProN", "Hiragino Mincho Pro",
             "Yu Mincho", "YuMincho",
             "MS PMincho", serif;
    font-optical-sizing: auto;
    font-style: normal;
}

/************************************************************/
/*   setting   */
/************************************************************/
*{
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
	word-wrap: break-word;
	-webkit-font-smoothing: antialiased;
}
body {
    font-family: "Noto Sans JP",
             "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro",
             "Yu Gothic", "YuGothic",
             "Meiryo", sans-serif;
    background-color: #ffffff;
    font-optical-sizing: auto;
    font-style: normal;
    font-weight: 400;
    color: #535353;
}
@media screen and (max-width:599px) { /*SP*/
    body{
        font-size: var(--f14);
        line-height: 1.8;
        letter-spacing: 0.01em;
    }
}
@media screen and (min-width:600px) , print { /*PC&TB*/
    body{
        font-size: var(--f18);
        line-height: 1.8;
        letter-spacing: 0.01em;
    }
}

img {
    width: 100%;
    vertical-align: bottom;
    -webkit-backface-visibility: hidden;
}

ul,ol{
    list-style: none;
}
/*------------------------------------------------*/

html,body{background-color: #fff!important;}
@media print { body{width: 100%!important;}}
/********** Protected **********/
.forPrint {display: none;}
.Protected {
	touch-callout:none;
	user-select:none;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
}
@media print {
	.Protected {display: none;}
	.forPrint {display: block;}
	.ClearFix:after {content: ".";height: 1px;overflow: hidden;visibility: hidden;}
}

/********** A **********/
@media screen and (max-width:599px) { /*SP*/
    a {
        overflow-wrap: break-word;
        word-break: break-word;
        hyphens: auto;
        color: #000;
        text-decoration: none;
    }
    button{
        letter-spacing: 0.08em;
        color: #000;
        background-color: transparent;
        border: none;
        padding: 0; margin: 0;
    }
    button:hover{
        cursor: pointer;
    }
}
@media screen and (min-width:600px) , print { /*PC&TB*/
    a {
        overflow-wrap: break-word;
        word-break: break-word;
        hyphens: auto;
        color: #000;
        text-decoration: none;
        transition: 0.3s ease;
    }
    a picture{
        transition: 0.3s ease;
    }
    button{
        letter-spacing: 0.08em;
        color: #000;
        background-color: transparent;
        border: none;
        padding: 0; margin: 0;
        transition: 0.3s ease;
    }
    button:hover{
        cursor: pointer;
    }
}

/********** BR **********/
@media screen and (max-width:599px) { /*SP*/
    .spNone{ display: none; }
    .tbNone{ display: none; }
    .pcNone{ display: block; }
}
@media screen and (min-width:600px) and ( max-width:960px) { /*TB*/
    .spNone{ display: block; }
    .tbNone{ display: block; }
    .pcNone{ display: none; }
}
@media screen and (min-width:961px) , print { /*PC*/
    .spNone{ display: block; }
    .tbNone{ display: none; }
    .pcNone{ display: none; }
}

/********** width **********/
.windowWidth{
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}

@media screen and (max-width:599px) { /*SP*/
    .contentsWidth{
        width: calc(100% - 30px);
        display: flex;
        flex-wrap: nowrap;
        flex-direction: column;
        align-items: center;
    }
    .spcw100{
        width: 100%;
        align-items: start;
    }
}
@media screen and (min-width:600px) and ( max-width:1259px) { /*TB*/
    .contentsWidth{
        /* width: 1200px; */
        width: 95.24vw;
        display: flex;
        flex-wrap: nowrap;
        flex-direction: column;
        align-items: center;
    }
}
@media screen and (min-width:1260px) , print { /*PC*/
    .contentsWidth{
        width: 1200px;
        display: flex;
        flex-wrap: nowrap;
        flex-direction: column;
        align-items: center;
    }
}

/********** LOADING **********/
#FW_loading{
    width: 100vw; height: 100%;
    display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;
    flex-direction: column;
    background-color: #fff;
    position: fixed;
    top: 0; left: 0;
    z-index: 6000000;
}

.loader,
.loader:after {
  border-radius: 50%;
  width: 60px;
  height: 60px;
}
.loader {
  margin: 60px auto;
  border-top: 6px solid #B47171;
  border-right: 6px solid #B47171;
  border-bottom: 6px solid #B47171;
  border-left: 6px solid #D9B7B7;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}