/*  General
=============================================== */

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,main {margin:0;padding:0;border:0;font-size:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display:block;}
body {font-family:Verdana,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
wbr:after {content:"\00200B";}

/*	TBS reset
============================== */
.alt {position:absolute;top:-5000px;left:-9999px;}
.clearfix:after {content:"";clear:both;display:block;}
.hide-txt {text-indent:110%;white-space:nowrap;overflow:hidden;}
.fp-causion {display:none;}
.nocontxt {-webkit-touch-callout: none;-webkit-user-select: none;user-select: none;-webkit-user-drag:none;}
.nocontxt img {pointer-events: none;}
@media all and (min-width:768px) {
.alt-pc {position:absolute;top:-5000px;left:-9999px;}
.clearfix-pc:after {content:"";clear:both;display:block;}
.hide-txt-pc {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
@media all and (max-width:767px) {
.alt-smp {position:absolute;top:-5000px;left:-9999px;}
.clearfix-smp:after {content:"";clear:both;display:block;}
.hide-txt-smp {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
div.embed-tbsplayer {
background-color:#000;
position:relative;
height:0;
padding-top:56.25%;
}
div.embed-tbsplayer .tbs-player {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}
div.embed-tbsplayer-audio {
background-color:#fff;
}
div.embed-tbsplayer-audio .tbs-player {
height:46px;
}
div.lbx-overlay {
z-index:10000;position:absolute;background-color:#000;width:100%;height:100%;left:0;top:0;right:0;bottom:0;opacity:0.9;
}

:root {
    --cl-blue:#0050ff;
    --cl-blue2:#0034ff;
    --cl-lightgray:#E6E6E6;
    --cl-lightgray2:#EFEFEF;
}

body { background-color:var(--cl-lightgray2); color:#3B3F4A; text-align:center; font-family:"noto-sans-cjk-jp", sans-serif; font-weight:400; font-style: normal; font-feature-settings:"palt"; letter-spacing:0.05em; }

.cover { background:url(/img/cover.gif); display:block; width:100%; height:100%; }
.lazy { display:block; position:relative; }

#pagebody { display:flex; }

/* font style
-------------------------------- */

.txts { font-size:80%; }
.txtss { font-size:70%; }
.txtb { font-size:120%; }
.txtbb { font-size:140%; }
.txt-r { display:block; text-align:right; }

/* br point
-------------------------------- */

.br-pc { display:block; }
.br-smp { display:none; }

@media all and (max-width: 979px) {

.br-pc { display:none; }
.br-smp { display:block; }

}

/* word br
-------------------------------- */

.wbr { display:inline-block; }



/* header
============================================= */

#header { width:100%; padding:15px 5px 15px 15px; box-sizing:border-box; background-color:#fff; border-bottom:var(--cl-lightgray) 1px solid; }
#header:after {content:"";clear:both;display:block;}

#logo-area { float:left; width:300px; height:33px; }
#logo { display:block; width:100%; height:100%; background:url(../img/common/logo.png) center center no-repeat; background-size:cover; text-indent:-9999px; }

#hd-link-pc { float:right; display:flex; align-items:center; }
#hd-link-pc ul { display:flex; }
#hd-link-btn-pc li { margin-left:0.5em; }
#hd-link-btn-pc li a { display:block; padding:0.75em 1.0em; box-sizing:border-box; border-radius:1000px; background-color:var(--cl-blue); font-size:90%; font-weight:700; color:#fff; text-decoration:none; }
@media (hover: hover) { #hd-link-pc ul li a:hover { opacity:0.7; } }
#hd-link-lang-pc { font-size:90%; }
#hd-link-lang-pc li:first-child { margin:0 0 0 0.5em; border-right:#3B3F4A 1px solid; }
#hd-link-lang-pc li a { color:#3B3F4A; text-decoration:none; padding:0.5em; }
#hd-link-lang-pc li a.current { text-decoration:underline; opacity:0.5; }

#nav-toggle { display:none; }

/* ---- Media Queries ---- */

@media all and (max-width: 979px) {

#header { position:fixed; z-index:1001; }

#logo-area { float:none; width:230px; height:25px; }
#hd-link-pc { display:none; }

#nav-toggle { display:block; position:fixed; right:15px; top:16px; width:20px; height:20px; cursor: pointer; z-index:1004; -webkit-tap-highlight-color:rgba(0,0,0,0); }
#nav-toggle div { position:relative; }
#nav-toggle span { display:block; position:absolute; height:3px; background:var(--cl-blue); left:0; zoom: 1; -webkit-transition:.35s ease-in-out; transition:.35s ease-in-out; }
#nav-toggle span:nth-child(1) { top:0; width:20px; }
#nav-toggle span:nth-child(2) { top:7px; width:20px; }
#nav-toggle span:nth-child(3) { top:14px; width:15px; }
#nav-toggle.open span:nth-child(1) { top:9px; -webkit-transform:rotate(-135deg); transform:rotate(-135deg); zoom: 1; }
#nav-toggle.open span:nth-child(2) { width:0; left: 50%; }
#nav-toggle.open span:nth-child(3) { top:9px; width:20px; -webkit-transform: rotate(135deg); transform:rotate(135deg); zoom: 1; }

}


/* gnav
============================================= */

#hd-link-smp { display:none; }

#gnav-area { width:18.0em; border-right:1px solid var(--cl-lightgray); box-sizing:border-box; background-color:#fff; }
#gnav { width:100%; padding:0; text-align:left; line-height:120%; position:sticky; top:0; font-weight:700; }
#gnav > li { list-style:none; border-bottom:1px solid var(--cl-lightgray); box-sizing:border-box; }
#gnav ul { height:0; padding:0; overflow:hidden; transition:.5s; margin:0; }
#gnav > li > ul > li { border-bottom:1px solid var(--cl-lightgray); border-left:0.5em solid var(--cl-lightgray); box-sizing:border-box; }
#gnav > li > ul > li:first-child { border-top:1px solid var(--cl-lightgray); }
#gnav > li > ul > li:last-child { border-bottom:none!important; }
#gnav > li a { position:relative; display:block; width:100%; height:100%; padding:1.0em 2.0em 1.0em 1.0em; box-sizing:border-box; text-decoration:none; color:#3B3F4A; }
#gnav > li a::before,
#gnav > li a::after { content:""; position:absolute; right:1.125em; width:2.5px; height:8px; background-color:var(--cl-blue); transition:.5s; }
#gnav > li a::before { transform:rotate(-45deg); top:calc(50% - 5px); }
#gnav > li a::after { transform:rotate(45deg); top:50%; }
@media (hover: hover) { #gnav > li a:hover { background-color:#efefef; } }
#gnav:nth-of-type(1) li.active li:last-child { border-bottom:1px solid var(--cl-lightgray); }
#gnav button { position:relative; border:none; width:100%; background-color:inherit; color:#3B3F4A; cursor:pointer; text-align:left; padding:1.0em 2.5em 1.0em 1.0em; box-sizing:border-box; font-size:1em; font-weight:700; font-family:inherit; }
@media (hover: hover) { #gnav button:hover { background-color:#efefef; } }
#gnav button::before,
#gnav button::after { content:""; position:absolute; top:calc(50% - 5px); width:2.5px; height:8px; background-color:var(--cl-blue); transition:.5s; }
#gnav button::before { transform:rotate(-45deg); right:calc(1.0em + 5px); }
#gnav button::after { transform:rotate(45deg); right:1.0em; }
#gnav > li.active button::before { transform:rotate(-135deg); transition:.5s; }
#gnav > li.active button::after { transform:rotate(135deg); transition:.5s; }
#gnav:nth-of-type(2) { background-color:#357D87; }
#gnav:nth-of-type(2) ul { background-color:#519FA5; border-top:1px solid #5D9FA8; }
#gnav:nth-of-type(2) button:hover { background-color:#1C4B56; }
#gnav:nth-of-type(2) li li { border-bottom:1px dotted #73BEBF; }
#gnav:nth-of-type(2) li.active li:last-child { border-bottom:1px solid #5D9FA8; }
#gnav.active { overflow-y:auto; }

.gnav-current > ul > li { border-bottom:1px solid var(--cl-blue2)!important; border-left:0.5em solid var(--cl-blue2)!important; }
.gnav-current > ul > li:first-child { border-top:1px solid var(--cl-blue2)!important; }
.gnav-current a, .gnav-current button { background-color:var(--cl-blue)!important; color:#fff!important; }
.gnav-current a::before,
.gnav-current a::after,
.gnav-current button::before,
.gnav-current button::after { background-color:#fff!important; }
@media (hover: hover) {
    .gnav-current a:hover { background-color:var(--cl-blue2)!important; }
    .gnav-current button:hover { background-color:var(--cl-blue2)!important; }
}

/* ---- Media Queries ---- */

@media all and (max-width: 979px) {

#hd-link-smp { display:flex; position:relative; width:100%; border-bottom:1px solid var(--cl-lightgray); /*justify-content:center;*/ align-items: center; padding:1.0em 0.5em; box-sizing:border-box; }
#hd-link-btn-smp { display:flex; /*margin:auto; position:absolute; left:50%; transform: translateX(-50%);*/ }
#hd-link-btn-smp li { margin:0 0.25em; }
#hd-link-btn-smp li a { display:block; padding:0.75em 1.0em; box-sizing:border-box; border-radius:1000px; background-color:var(--cl-blue); font-size:85%; font-weight:700; color:#fff; text-decoration:none; white-space:nowrap; }
#hd-link-lang-smp { display:flex; margin-left:auto; font-size:90%; }
#hd-link-lang-smp li:first-child { border-right:#3B3F4A 1px solid; }
#hd-link-lang-smp li a { color:#3B3F4A; text-decoration:none; padding:0.5em; }
#hd-link-lang-smp li a.current { text-decoration:underline; opacity:0.5; }

#gnav-area { position:fixed; z-index:1000; padding-top:57px; /**/top:-100vh; left:0; width:100%; height:100vh; overflow-y:scroll; overflow-x:hidden; background-color:#fff; font-size:90%; }
#gnav { position:static; }
#gnav > li:last-child { border-bottom:1px solid var(--cl-lightgray); }
#gnav-area.open,
#gnav-area.close { animation-duration:0.5s; animation-timing-function:cubic-bezier(0.77, 0, 0.175, 1); animation-fill-mode:forwards; }
#gnav-area.open { animation-name:slideIn; }
#gnav-area.close { animation-name:slideOut; }
#gnav-area.open::before { display:block; }

@keyframes slideIn {
0% { top:-100vh; }
100% { top:0px; }
}
@keyframes slideOut {
0% { top:0px; }
100% { top:-100vh; }
}

}


/* main
============================================= */

#main-area { flex:1; background-color:#fff; }
#main { max-width:70.0em; padding:1.8em 2.0em 0 2.0em; box-sizing:border-box; text-align:left; font-size:95%; }
#main a { color:var(--cl-blue); }
@media (hover: hover) { #main a:hover { opacity:0.7; } }
#main a.exlink::after { display:inline-block; content:""; margin:0.3em 0 auto 0.5em; width:0.9em; height:0.9em; background:url(../img/common/exlink.png) center center no-repeat; background-size:100% auto; }

/* ---- Media Queries ---- */

@media all and (max-width: 979px) {

#main-area { padding-top:55px; }
#main { padding:1.3em 1.5em 0 1.5em; font-size:85%; }

}


/* mainttl
-------------------------------- */

#mainttl { width:100%; height:250px; }
#mainttl .inner { display:flex; flex-flow:column; justify-content:center; align-items:flex-start; width:100%; height:100%; padding:4.0em 12.0em 4.0em 4.0em; box-sizing:border-box; background-position:right bottom; background-repeat:no-repeat; background-size:cover; text-align:left; }
#mainttl .ttl,
#mainttl .leadcopy { color:#fff; text-shadow:2px 2px 4px rgba(0,69,255,0.2); }
#mainttl .ttl { padding-bottom:0.4em; font-size:220%; line-height:140%; }
#mainttl .leadcopy { font-size:120%; font-weight:700; line-height:140%; }

/* ---- Media Queries ---- */

@media all and (max-width: 979px) {

#mainttl { position:relative; width:100%; height:0; padding-top:calc(500% / 750 * 100); }
#mainttl .inner { position:absolute; left:0; top:0; justify-content:start; align-items:center; padding:10.0vw 4.5vw 0 4.5vw; background-position:center center; text-align:center; }
#mainttl .ttl { font-size:7.0vw; }
#mainttl .leadcopy { font-size:3.5vw; }

}

/* main parts
-------------------------------- */

#main .chapter { margin-bottom:2.0em; border-bottom:var(--cl-lightgray) 1px solid; }
#main .chapter:last-child { border-bottom:none; }
#main .box { margin-bottom:1.5em; }
#main .subttl { padding-bottom:0.5em; font-size:180%; line-height:140%; }
#main .sttl { padding-bottom:0.5em; font-size:150%; line-height:140%; }
#main .ssttl { padding-bottom:0.5em; font-size:120%; line-height:140%; }
#main .txt { padding-bottom:0.7em; line-height:170%; }

#main .list { padding:0 0 1.0em 1.2em; }
#main .list li { padding-bottom:0.5em; line-height:170%; list-style-type:disc; }
#main .list-nm { padding:0 0 1.0em 1.2em; }
#main .list-nm li { padding-bottom:0.5em; line-height:170%; list-style-type:decimal; }
#main .list-clnm { padding-bottom:1.0em; counter-reset:my-counter; list-style:none; }
#main .list-clnm li { padding:0 0 0.5em 1.4em; position:relative; line-height:170%; }
#main .list-clnm li:before { content:counter(my-counter); counter-increment:my-counter; border:1px solid; border-radius:50%; box-sizing:border-box; display:flex; justify-content:center; align-items:center; height:1.375em; width:1.375em; font-size:85%; line-height:1; position:absolute; top:0.35em; left:0; }

#main .btn { padding-bottom:1.0em; margin:0 -0.5em; }
#main .btn.btn-center { text-align:center; }
#main .btn.btn-right { text-align:right; }
#main .btn p { display:inline-block; padding:0 0.5em; }
#main .btn p a { display:inline-block; position:relative; padding:0.9em 2.5em 1.1em 1.5em; box-sizing:border-box; border-radius:1000px; background-color:var(--cl-blue); font-size:90%; font-weight:700; color:#fff; text-decoration:none; text-align:center; line-height:120%; }
@media (hover: hover) { #main .btn p a:hover { opacity:0.7; } }
#main .btn p a.exlink::after { display:inline-block; content:""; margin:0.3em 0 auto 0.5em; width:0.9em; height:0.9em; background:url(../img/common/exlink_w.png) center center no-repeat; background-size:100% auto; }
#main .btn p a::before { position:absolute;  top:calc(50% - 0.5em); right:1.0em; display:inline-block; content:""; width:1.0em; height:1.0em; background:url(../img/common/arrow_w.png) center center no-repeat; background-size:auto 100%; }

.mail-txt { margin:4px 0 0 0; display:block; width:171px; height:19px; background:url(../img/common/mail_txt.png) center center no-repeat; background-size:cover; text-indent:-9999px; }

/* ---- Media Queries ---- */

@media all and (max-width: 979px) {

#main .subttl { font-size:155%; }
#main .sttl { font-size:140%; }
#main .ssttl { font-size:110%; }
#main .chapter { margin-bottom:1.5em; }
#main .box { margin-bottom:1.0em; }

}



/* footer
============================================= */

#footer { padding:2.0em; text-align:center; }
#copyright { font-size:90%; line-height:140%; }

/* ---- Media Queries ---- */

@media all and (max-width: 979px) {

#footer { padding:1.0em; }
#copyright { font-size:80%; }

}


/*eof*/