/*  Common
=============================================== */

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

/* General
-------------------------------- */

#con-body { color:#333; text-align:center; /* general font */ font-family:Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; /* adobe font */ font-family:source-han-sans-japanese, sans-serif; font-weight:400; font-style:normal; }

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

.lazy { display:block; position:relative; }


/*media print*/
@media print {
body {display:none !important;}
}

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

.txts { font-size:80%; }
.txtb { font-size:120%; }
.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-area { width:100%; border-bottom:#EBEBF5 1px solid; }

#header { width:980px; margin:auto; padding:15px; box-sizing:border-box; }
#logo { width:180px; height:30px; }
#logo a { display:block; width:100%; height:100%; background:url(../img/logo.png) center center no-repeat; background-size:cover; text-indent:-9999px; }

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

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

#header { width:auto; }

}


/* Main
============================================= */

#hd-area { padding:50px 0; background-image:url(../img/hd_bg.jpg); background-position:center center; background-repeat:no-repeat; background-size:100% auto; }

#main { width:980px; margin:auto; padding-top:50px; }

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

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

#hd-area { padding:30px 0; background-size:auto 100%; }

#main { width:auto; }

}


/* btn
============================================= */

.btn { display:inline-block; }
.btn a { display:block; position:relative; width:100%; height:100%; padding:1.3em 1.3em 1.3em 0.3em; box-sizing:border-box; background-color:#0050FF; border-radius:1000px; color:#fff; text-decoration:none; }
.btn a::after { position:absolute; top:1.45em; right:1.3em; display:inline-block; content:""; width:0.8em; height:0.8em; background-position:center center; background-repeat:no-repeat; background-size:contain; /* hover */ transition:transform 0.2s ease-out; }
@media (hover: hover) { .btn:hover a::after { transform:translateX(4px); } }

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

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

.btn { font-size:90%; }

}

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

.btn { font-size:80%; }

}


/* maintitle
============================================= */

#maintitle { width:980px; margin:0 auto 50px auto; color:#fff; text-shadow:0px 0px 4px rgba(0,0,0,0.4); }
#maintitle .title { margin-bottom:0.7em; font-size:240%; }
#leadcopy { font-size:110%; line-height:160%; }

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

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

#maintitle { width:90%; margin:0 5% 30px 5%; }
#maintitle .title { font-size:160%; }
#leadcopy { font-size:90%; }

}


/* feature
============================================= */

#feature { width:900px; display:flex; justify-content:center; flex-wrap: wrap; margin:0 auto; padding:30px; box-sizing:border-box; border-radius:10px; color:#fff; background-color:rgba(255, 255, 255, 0.3); text-shadow:0px 0px 4px rgba(0,0,0,0.4); }
#feature .title { margin-bottom:1.0em; font-size:130%; }
#feature-list { padding-left:1.0em; text-align:left; font-size:120%; line-height:140%; }
#feature-list li { text-indent:-1.0em; padding-bottom:0.5em; }

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

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

#feature { width:90%; margin:0 5% 0 5%; padding:20px; }
#feature .title { font-size:110%; }
#feature-list { font-size:90%; }

}


/* pagelink
============================================= */

#pagelink { margin-bottom:50px; }
#pagelink ul { /* for space */ font-size:0; }
#pagelink ul li { display:inline-block; margin:10px; vertical-align:middle; /* for space */ font-size:1rem; }

/* btn */
#btn-pagelink-flow,
#btn-pagelink-faq { width:17.0em; }
#btn-pagelink-flow a::after,
#btn-pagelink-faq a::after { background-image:url(../img/arrow_white_r.png); }


/* scene
============================================= */

#scene { margin-bottom:50px; }
#scene .title { margin-bottom:0.5em; font-size:150%; }
.slick-track { display:flex; justify-content:center; align-items:stretch; padding:20px 0; }
#scene-list ul { display:flex; justify-content:center; align-items:stretch; padding:20px 0; box-sizing: border-box; }
.slick-slide { height:auto!important; }
#scene-list { width:100%; margin-bottom:20px; /* for space */ font-size:0; }
.scene-list-item { display:inline-block; margin:0 10px; width:280px; height:auto!important; vertical-align:top; border-radius:10px; border:rgba(0,0,0,0.1) 1px solid; box-shadow:0px 2px 4px rgba(0,0,0,0.2); text-align:left; /* for space */ font-size:1rem; }
#scene-list .pic { position:relative; width:100%; height:0; padding-top:56.25%; background-color:rgba(0,0,0,0.1); border-radius:10px 10px 0 0; }
#scene-list .pic span { position:absolute; display:block; left:0; top:0; width:100%; height:100%; border-radius:10px 10px 0 0; background-position:center center; background-repeat:no-repeat; background-size:cover; text-indent:-9999px; }
#scene-list .subttl { padding:15px 15px 0 15px; font-size:120%; line-height:120%; color:#0050FF; }
#scene-list .txt { padding:15px; font-size:90%; line-height:140%; }
#scene-list .slick-arrow { position:absolute; top:calc(50% - 23px); width:45px; height:45px; border-radius:1000px; background-color:#fff; background-repeat:no-repeat; background-size:25% auto; box-shadow:0px 2px 4px rgba(0,0,0,0.2); /* reset */ /*background-color:transparent;*/ border:none; cursor:pointer; outline:none; padding:0; appearance:none; text-indent: -9999px; }
#scene-list .slick-prev { left:-23px; z-index:12; background-image:url(../img/arrow_blue_l.png); background-position:45% center; }
#scene-list .slick-next { right:-23px; z-index:13; background-image:url(../img/arrow_blue_r.png); background-position:55% center; }

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

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

.scene-list-item { margin:0 5px; width:200px; }

#scene-list .subttl { padding:10px 10px 0 10px; font-size:100%; }
#scene-list .txt { padding:10px; font-size:80%; }

#scene-list .slick-arrow { top:calc(50% - 15px); width:30px; height:30px; }
#scene-list .slick-prev { left:5px; }
#scene-list .slick-next { right:5px; }

}


/* voice
============================================= */

#voice { margin-bottom:50px; }
#voice .title { margin-bottom:1.0em; font-size:150%; }

#voice-list { text-align:left; }
#voice-list ul { display:flex; align-items:stretch; flex-wrap:wrap; }
#voice-list ul li { width:48%; margin:0 1% 2% 1%; padding:20px; box-sizing:border-box; border-radius:10px; background-color:#f0f0f0; }
#voice-detail #voice-list ul li { width:100%; margin:0 0 2% 0; }
#voice-list .cat { margin-bottom:0.5em; display:inline-block; margin-right:0.5em; padding:0 0.5em; border-radius:0.5em; font-size:85%; font-weight:bold; }
#voice-list .cat-school { background-color:#32C83C; }
#voice-list .cat-company { background-color:#FFAA1E; }
#voice-list .name { margin-bottom:0.3em; font-size:120%; line-height:140%; }
#voice-list .title { margin-bottom:0.5em; font-size:140%; line-height:140%; }
#voice-list .txt { font-size:90%; line-height:160%; }

/* btn */
.btn-more { margin-top:0.5em; text-align:right; }
.btn-more a { color:#0050FF; }
.btn-more::after { display:inline-block; content:""; position:relative; top:0.25em; width:1.2em; height:1.2em; margin-left:0.3em; border-radius:1000px; background:#0050FF url(../img/arrow_white_r.png) center center no-repeat; background-size:25% auto; }

#btn-voice-back { width:14.0em; margin:1.0em 0; }
#btn-voice-back a {  padding:1.3em 0.3em 1.3em 1.3em; }
#btn-voice-back a::after { left:1.3em; background-image:url(../img/arrow_white_l.png); }
@media (hover: hover) { #btn-voice-back:hover a::after { transform:translateX(-4px); } }

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

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

#voice { width:90%; margin:0 5% 30px 5%; }
#voice-list ul li { width:100%; margin:0 0 4% 0; padding:15px; }
#voice-list .name { font-size:100%; }
#voice-list .title { font-size:120%; }
#voice-list .txt { font-size:80%; }

}


/* flow
============================================= */

#flow { width:98%; margin:0 1% 50px 1%; }
#flow .title { margin-bottom:1.0em; font-size:150%; }

.flow-box { margin-bottom:20px; padding:25px 30px 30px 30px; box-sizing:border-box; border-radius:15px; background-color:#f0f0f0; text-align:left; }
.flow-box .subtitle { margin-bottom:0.5em; font-size:120%; line-height:120%; }
.flow-box .subtitle .nm { display:inline-block; margin-right:0.5em; width:1.0em; padding:0.5em; background-color:#fff; border-radius:50%; font-size:80%; line-height:100%; text-align:center; }
.flow-box .txt { line-height:160%; }
.flow-arrow { margin:0 auto 20px auto; width:42px; height:21px; background:url(../img/flow_arrow.png) center center no-repeat; background-size:contain; text-indent:-9999px; }

.flow-goal { font-size:160%; line-height:120%; font-weight:bold; }

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

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

#flow { width:90%; margin:0 5% 30px 5%; }

.flow-box { padding:15px 20px 20px 20px; border-radius:10px; }
.flow-box .subtitle { font-size:100%; }
.flow-box .txt { font-size:90%; }

.flow-goal { font-size:130%; }

}


/* btn-regist
============================================= */

#btn-regist { position:fixed; top:60px; right:0; z-index:1000; width:13.0em; text-align:left; font-size:120%; line-height:120%; }
#btn-regist a { position:relative; display:block; width:100%; height:100%; padding:1.0em 1.0em 1.0em 2.5em; box-sizing:border-box;  background-color:#0050FF; text-decoration:none; color:#fff; box-shadow:0px 4px 6px rgba(0,0,0,0.05); }
#btn-regist a::before { position:absolute; content:""; top:1.75em; left:1.0em; width:1.0em; height:1.0em; background:url(../img/arrow_white_r.png) center center no-repeat; background-size:contain; }

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

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

#btn-regist { position:fixed; top:auto; bottom:0; right:0; width:100%; text-align:center; font-size:4.8vw; }
#btn-regist a { padding:0.8em 0.5em; border-top:#ddd 1px solid; }
#btn-regist br { display:none; }
#btn-regist a::before { position:static; display:inline-block; width:0.8em; height:0.8em; margin-right:0.2em; }

}


/* inquiry
============================================= */

#inquiry { padding:30px; border-top:#EBEBF5 1px solid; }
#inquiry .title { margin-bottom:0.5em; font-size:140%; }
#inquiry .txt { margin-bottom:1.0em; line-height:140%; }
#inquiry .telnum { display:block; margin:0.5em 0; font-size:200%; font-weight:bold; color:#333; text-decoration:none; }

/* btn */
#btn-inquiry { width:21.0em; margin:1.0em 0; }
#btn-inquiry a::after { background-image:url(../img/arrow_white_r.png); }

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

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

#inquiry { padding:30px 30px 15.0vw 30px; }

}


/*eof*/
