@charset "UTF-8";
/* CSS Document */

#header{ background: #65ACE3; width:100%; text-align:center;}
#header > .wrap{ width:96%; margin:auto; padding:0.5em 0 0.75em;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:space-between;-moz-box-pack:space-between;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}
#header > .wrap .num1{ width: 9%; margin-top: 0.5em;}
#header > .wrap .num2{ margin:0 0.75em; flex:1;}
#header > .wrap .num3{ width: 9%; margin-top: 0.5em;}


#main #common_cont{ margin-top: 0.5em;}
#main #common_cont p.num2{ background: #D5EAB8;}


body{  background: url(../images/bg.png);}
body.one_load_hukidashi {position:relative; overflow: hidden;}
body.one_load_hukidashi .click_none{z-index: 106;display: block;position:absolute;left: 0;right: 0;top: 0;width: 100%;height: 100%;}
body.one_load_hukidashi .modal_gray{z-index: 103;display: block;background: rgba(0,0,0,0.50);position: absolute;left: 0;right: 0;top: 0;width: 100%;height: 100%;}
body.one_load_hukidashi .hukidashi{z-index: 105; max-width:250px; width:55%; position:fixed; bottom:20%; left:50%;
-moz-transform: translateX(-60%);
-webkit-transform: translateX(-60%);
-o-transform: translateX(-60%);
-ms-transform: translateX(-60%);
transform: translateX(-60%); }
body.one_load_hukidashi.absolute .hukidashi{ position:absolute;}

body.one_load_hukidashi .hukidashi img{
-webkit-transition: opacity 0.4s linear 0s ;
-moz-transition: opacity 0.4s linear 0s ;
-o-transition: opacity 0.4s linear 0s ;
transition: opacity 0.4s linear 0s ;
-webkit-animation-duration:1.5s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count:infinite;
-webkit-animation-name:hukidashi_pos;
animation: 1.5s linear infinite hukidashi_pos;}
/* width:453px; height:352px;*/

@-webkit-keyframes hukidashi_pos {
20% {-moz-transform: translateY(0);-webkit-transform: translateY(0);-o-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0); }
50% {-moz-transform: translateY(0.75em);-webkit-transform: translateY(0.75em);-o-transform: translateY(0.75em);-ms-transform: translateY(0.75em);transform: translateY(0.75em); }
100% {-moz-transform: translateY(0);-webkit-transform: translateY(0);-o-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);}
}
@keyframes hukidashi_pos {
20% {-moz-transform: translateY(0);-webkit-transform: translateY(0);-o-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0); }
50% {-moz-transform: translateY(0.75em);-webkit-transform: translateY(0.75em);-o-transform: translateY(0.75em);-ms-transform: translateY(0.75em);transform: translateY(0.75em); }
100% {-moz-transform: translateY(0);-webkit-transform: translateY(0);-o-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);}
}



#main{ position:relative; text-align:center;}
#main > .wrap{ padding:1em 0 3em;background:url(../images/bg.png);}
#main #main_cont{ position:relative; background:#FFF; border:1px solid #999; width:94%; border-radius:1em; margin:0 auto 1em; padding:1em 0.5em 1em;}

@media all and (min-width: 750px) {
#main #main_cont{padding:1em 45px 1em;}
#main #main_cont .q_wrap{width: 90%; margin: 0 auto 1em;}
}

/*暗記*/
#main #main_cont .q .ttl,#main #main_cont .a .ttl{ margin-bottom:1em; text-align:left; font-weight:700; font-size:0.8em;}
#main #main_cont .q_wrap{ min-height:2em; margin-bottom:1em;}
#main #main_cont .a{ position:relative;}
#main #main_cont .a_wrap{ display:block;}
#main #main_cont #canvas_cont{ position:relative;min-height:3em;}

#main #common_cont{ width:95%; margin:0 auto 1.0em;}
#main #common_cont p{ margin-bottom:1.5em;}
#main #common_cont p.num1{display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:space-between;-moz-box-pack:space-between;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center; max-width:550px; margin:0 auto 1em; width:92%;}
#main #common_cont p.num1 .common{ display:inline-block; margin:0 0.5em;}
#main #common_cont p.num2{border: 3px solid;
border-radius: 1.5em;
padding: 0.2em 1em;
font-size: 0.9em;
font-weight: 700;
letter-spacing: 0.1em;
max-width: 551px;
margin: 0 auto 1em;
text-align: center;
background: #D5EAB8;}
#main #common_cont p.num2 .name{ font-size:0.75em; vertical-align: 0.1em; }

/*演習*/
#main.ensyu #page_nav > .wrap .icon,#main.ensyu #page_nav .setumei{ display:none;}
#main #main_cont .mondai_wrap{ position:relative; margin-bottom:4em;}
#main #main_cont .mondai_wrap:last-of-type{ margin-bottom:0;}
#main #main_cont .mondai_wrap .sentaku_wrap{ margin-top:0.5em;
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#main #main_cont .mondai_wrap .sentaku_wrap .num{ border:0.15em solid; border-radius:0.5em; padding:0.2em 1em; margin:0.25em 0.5em; font-weight:700; cursor:pointer; font-size: 0.8em;
-moz-transition-property:width,opacity,transform,background,border,color;-webkit-transition-property:width,opacity,transform,background,border,color;-o-transition-property:width,opacity,transform,background,border,color;-ms-transition-property:width,opacity,transform,background,border,color;transition-property:width,opacity,transform,background,border,color;
-moz-transition-duration:0.5s;-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;-ms-transition-duration:0.5s;transition-duration:0.5s;}
#main #main_cont .mondai_wrap.click .sentaku_wrap .num{cursor:auto;}
#main #main_cont .mondai_wrap .sentaku_wrap .num:hover{ color:#FFF; background:#323232; border-color:#323232;}

#main #main_cont .mondai_wrap .sentaku_wrap .num.maru,#main #main_cont .mondai_wrap .sentaku_wrap .num.batu{-moz-transition-duration:0s;-webkit-transition-duration:0s;-o-transition-duration:0s;-ms-transition-duration:0s;transition-duration:0s;}
#main #main_cont .mondai_wrap .sentaku_wrap .num.maru{ color:#FF3201; background:#FFF;border-color:#FF3201;}
#main #main_cont .mondai_wrap .sentaku_wrap .num.batu{ color:#0031FF; background:#FFF;border-color:#0031FF;}
#main #main_cont .mondai_wrap .sentaku_wrap .num.batu{ color:#323232; background:#FFF;border-color:#323232;}

#main #main_cont .mondai_wrap .answer_data{ display:none;}


#main #main_cont .mondai_wrap .marubatu{ width:30%; max-width:170px; height: 30vw; max-height:170px;position:absolute; left:0; right:0; margin:auto;pointer-events: none; bottom:0%;  opacity:0;
transition-property : top,bottom,transform,opacity;
transition-duration : 0.6s;
 background-repeat:no-repeat;
 background-size:contain;
 background-position:center bottom;
-moz-transform: translateY(0%);
-webkit-transform: translateY(0%);
-o-transform: translateY(0%);
-ms-transform: translateY(0%);
transform: translateY(0%); }
#main #main_cont .mondai_wrap .marubatu.on{ bottom:0%; opacity:1;
-moz-transform: translateY(-75%);
-webkit-transform: translateY(-75%);
-o-transform: translateY(-75%);
-ms-transform: translateY(-75%);
transform: translateY(-75%);}
#main #main_cont .mondai_wrap .marubatu.on1{background-image:url(../images/marubatu_icon1.png);}
#main #main_cont .mondai_wrap .marubatu.on2{background-image:url(../images/marubatu_icon2.png);}

#main #main_cont .hasen{ width:100%; height:1.5em; max-height:108px;margin: -1em auto 3em;background:url(../images/hasen.png) repeat-x center center; background-size: auto 100%}




/*演習 手書き*/
#main #main_cont .kaisetu_area{ display:none;  position:relative;}
#main #main_cont .kaisetu_area .doudatta{position: absolute;width: 64%;text-align: center;bottom: 100%;left: 0;right: 0;margin: auto;padding-bottom: 0.5em;line-height: 1;}
#main #main_cont .mondai_wrap{ position:relative;}
#main #main_cont .mondai_wrap .btn_wrap{ margin-top:1em;
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#main #main_cont .mondai_wrap .btn_wrap span{border:0.15em solid; border-radius:0.5em; padding:0.2em 1em; margin:0.25em 0.5em; font-weight:600; cursor:pointer;}
#main #main_cont .mondai_wrap .btn_wrap .ensyu{}
#main #main_cont .mondai_wrap .btn_wrap .answer{}

#main #main_cont .mondai_wrap.tegaki .tegaki_area{ min-height:14em; background:rgba(33,0,0,0.10); position:relative;}

#main #main_cont .mondai_wrap.tegaki .text_area{font-weight: 700;line-height: 1.3;margin: 1em auto 0;font-size: 1.0em; display:none;}
#main #main_cont .mondai_wrap.tegaki:first-of-type .text_area{ display:block;}


#main #main_cont .mondai_wrap.tegaki.small{margin-bottom: 2em;}
#main #main_cont .mondai_wrap.tegaki.small .tegaki_area{min-height:6em; }
#main #main_cont .mondai_wrap.tegaki.medium .tegaki_area{min-height:14em; }
#main #main_cont .mondai_wrap.tegaki.large .tegaki_area{min-height:22em; }

#main #main_cont .kaisetu_area{ background:#FFF900; padding:1.5em 0.5em 0; margin-top:2em; display:none;}
#main #main_cont .kaisetu_area > img{ display:block; border-radius:1em; overflow:hidden; border:0.15em solid; padding:0.5em 0.25em; background:#FFF;}
#main #main_cont .mondai_wrap.tegaki .answer_select{ margin-top:0;}

#main #main_cont .mondai_wrap.tegaki.click .canvas_oekaki{pointer-events: none;}
#main #main_cont .mondai_wrap.tegaki .canvas_oekaki{
width:100%; height:100%; position:absolute;top:0%; left:0%; right:0;margin:auto; max-width:750px;box-sizing:content-box; z-index:6;}
#header{ max-width:750px; margin-left:auto; margin-right:auto; }

#main #main_cont .mondai_wrap .add_img{ position:relative;}
#main #main_cont .mondai_wrap .add_img::after{ display:none;}
body #add_modal{ display:none;}

@media all and (min-width: 751px) {
#main #main_cont .mondai_wrap .add_img::after{ content:"＋"; position:absolute; right: 19px;top: 330px; background:#65ACE2; color:#FFF; width:1.5em; height:1.5em; line-height:1.5; font-weight:900; display:block;}
body #add_modal{max-width: 1200px;position:fixed;left: 0;right: 0;margin: auto;z-index: 108;top: 0;width: 100%;height: 100vh; display:block;}
body #add_modal > img{position: absolute;left: 0;right: 0;margin: auto;z-index: 108;top: 0;bottom: 0;max-width: 98%;max-height: 98%;}
}

/*
<div id="add_modal"><p><img src="../../../images/c2/s/1/add_modal.png"></p></div>
*/



/*赤シート*/
#main #canvas_cont{ position:relative;}

#main .red_sheet_big{pointer-events: none;}
#main .red_sheet_big.on{pointer-events:auto;}
#main .red_sheet_big{background:rgba(255,130,140,1); position:absolute; width:100%; height:100%; z-index:3; border-radius:0; opacity:0;}
#main .red_sheet_big::after{ content:""; max-width:67px; width:1.5em; height:71px; position:absolute; left:0; top:0; background:url(../images/red_sheet_add.png) left top no-repeat; background-size:100% auto;}
#main .red_sheet_big.on{ opacity:1;}


/*ページナビ*/
#main #page_nav{padding-top:0.5em;}
#main #page_nav > .wrap{ width:94%; margin:0 auto; text-align:center; max-width:750px; position:relative; bottom:0; left:0; right:0;
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:space-between;-moz-box-pack:space-between;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center; padding-top:1em;
}
#main #page_nav > .wrap p{ display:block; width:10%; max-width:100px; min-width:50px;z-index:6; position:relative;}
#main #page_nav > .wrap p.back{ position:relative; z-index:6; }
#main #page_nav > .wrap p.next{ position:relative; z-index:6; }
#main #page_nav > .wrap p.next .add_wrap{width:100%; height:100%; display:block; position:absolute; left:0; top:0; z-index:8;}
#main #page_nav > .wrap p a{ display:block;}
footer.fixed{position:fixed; bottom:0; left:0; right:0;z-index:7; }

#main #page_nav > .wrap .icon{ margin:0 0.5em;width:auto;max-width: none;min-width: none; flex:1;
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:space-between;-moz-box-pack:space-between;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}
#main #page_nav > .wrap .icon span{ background:#65ACE2; color:#FFF; font-size:0.7em; border-radius:0.5em; padding:0.3em 0;  display:block; width:100%;margin:0 0.5em;}
#main #page_nav > .wrap .icon span img{ width:1.1em; vertical-align:-0.15em; display:inline-block; margin-right:0.2em;}
#main #page_nav > .wrap .icon .kaku{ display:block;}
#main #page_nav > .wrap .icon .kesu{ display:none;}
.canvas_open #main #page_nav > .wrap .icon .kaku{ display:none;}
.canvas_open #main #page_nav > .wrap .icon .kesu{ display:block;}
.canvas_close #main #page_nav > .wrap .icon .kaku{ display:block;}
.canvas_close #main #page_nav > .wrap .icon .kesu{ display:none;}

#main #page_nav > .wrap .icon .on{ display:block;}
#main #page_nav > .wrap .icon .off{ display:none;}


#main #page_nav #page_num{ font-weight:900; text-align:center; letter-spacing:0.3em; font-size:0.7em; margin: auto;width: auto;max-width: none;min-width: 0px;}

#main #page_nav .setumei{ font-size:0.9em; font-weight:700;display:inline-block; text-align:left; margin-top:1.5em;}
#main #page_nav .setumei span{ display:inline-block; text-align:left; text-indent:-1em; padding-left:1em;}



/*マルバツ選択*/

#main .answer_select{ background:#FFF900; padding:2em 1em; margin-top:1em; display:none;}
#main.anki .answer_select{ margin-top:0;}
#main.anki #main_cont .answer_select{ margin-top:0.5em;}
#main .answer_select > p{ text-align:center; font-weight:600; margin-bottom:1em; line-height:1.4;}
#main .answer_select > p span{ display:inline-block;}
#main .answer_select .maru_batu_wrap{
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content: center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}
#main .answer_select .maru_batu_wrap > div{ color:#FFF; margin:0 1em;}
#main .answer_select .maru_batu_wrap .maru{ background:url(../images/maru_off.png) no-repeat center center; background-size:100% auto;}
#main .answer_select .maru_batu_wrap .batu{ background:url(../images/batu_off.png) no-repeat center center; background-size:100% auto;}
#main .answer_select .maru_batu_wrap > div.off img{ opacity:0;}
/*
#main .answer_select .maru_batu_wrap .maru{ background:#FF3201; font-weight:900;} 
#main .answer_select .maru_batu_wrap .batu{ background:#0031FF;}
#main .answer_select .maru_batu_wrap > div.off{ background:#777777;}
*/



/*ラスト*/

#main.summary .count .text{ font-weight:900; text-align:center; font-size:1.2em; margin-right: -0;}
#main.summary .count .text .big{ font-weight:900; font-size:1.8em; padding:0 0.1em; display:inline-block;}
#main.summary .count .text .seikai{ background:#FF7371; border-radius:1em; color:#FFF; padding:0.2em 1.25em; display:block; vertical-align:0.3em; font-size:0.8em; width: 7em; margin:0.5em auto 0;}


#main.summary #common_cont p.num2{display: inline-block;min-width: 86%;}
#main.summary #common_cont p.num2{ margin-bottom: 0;}

#main.summary #page_nav{ display:none;}

#main.summary > .wrap{padding:1em 0 0;}

#main.summary #main_cont{ position:relative; background:none; border:none; width:100%; border-radius:0; margin:0 auto; padding:0 4% 1.25em;}

#main.summary #main_cont .marubatu{ position:relative; margin:0.25em auto 1.25em; display:inline-block;}
#main.summary #main_cont .marubatu > a{ position:absolute; top:0; width:48%; height:100%; display:block;}
#main.summary #main_cont .marubatu > a.link1{ left:0%;}
#main.summary #main_cont .marubatu > a.link2{ right:0%; width:50%;}

#main.summary .count .sub_ttl{ width:6em; max-width: 238px; margin:0 auto 0; text-align:center;}

#main.summary #main_cont .flex_wrap{ display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}
#main.summary #main_cont .flex_wrap .anime{max-width: 290px;	width: 45%;	margin: 0 0 -1em 0em;}


#main.summary .btn{ width:92%; margin:0.75em auto 0; color:#FFF; background:#65ace3;display:block; border-radius:0.75em; line-height:1; padding:0.5em 0.5em; font-weight:600; letter-spacing:0.25em;}
#main.summary .btn1{ color:#000;border:0.15em solid #000; background:#FFF; display:inline-block; width:auto; padding:0.5em 2em;border-radius:1em; margin:0;}

#main.summary  #honban_koukou{ background:#FFF; padding:3em 0 0;}
#main.summary .read{ font-weight:700; font-size:1.1em; margin:0 auto 2em;}
#main.summary .sub_ttl2{ font-weight:700; font-size:1.1em; margin:3.5em auto 0.5em;}
#main.summary .img{ width:92%; margin:0.5em auto 1.5em; text-align:center; max-width:560px;}
#main.summary .btn3{ width:60%; margin:0 auto; text-align:center; display:block;}

#main.summary .btn4{ width:92%; margin:0.75em auto 0; background:#FFF; color:#65ace3; border:0.15em solid #65ace3; display:block; border-radius:0.75em; line-height:1; padding:0.25em 0.5em;letter-spacing:0.25em; font-weight:600;}

#main.summary .slide_wrap{ width:92%; margin:1em auto 0; text-align:center; max-width:560px;}
#main.summary .slick-dots{position: relative;bottom: 0;margin-top: 0.5em; line-height:0;}
#main.summary .slick-dots li{ width:14px; height:14px; margin:0 0.5em;}
#main.summary .slick-dots li button{width: auto;height: auto;padding: 0;}
#main.summary .slick-dots li button::before{ width:100%; height:100%; background:#c7c7c7; opacity:1; border:none;}
#main.summary .slick-dots li.slick-active button::before{ background:#64ACE3;}

#main.summary #icon_wrap{ background:#65ACE3; text-align:center; padding:2em 1em; margin:3em auto 0;}
#main.summary #icon_wrap .ttl{ color:#FFF; font-weight:600; font-size:1em; margin:auto; letter-spacing:0.02em}
#main.summary #icon_wrap .icon{ display:inline-block; max-width:165px; width:30%;}
#main.summary #icon_wrap .icon1{ margin:0.75em 4% 0 0 ;}
#main.summary .bottom2{ margin-bottom: 0.5em;}



#main.summary{ font-size: 0.75em; text-align: center; width: 90%; margin: auto;}
#main.summary .text_slide_wrap{ background: #FFF; border: 1px solid #000; border-radius: 1em; padding: 1em; margin: 2em auto 0;}
#main.summary .slide_click{ position: relative; font-size: 1.2em; padding: 0.0em 2em 0em; line-height: 1.2;}
#main.summary .slide_click .text{ color: #005BAC; font-weight: bold; }
#main.summary .slide_click .icon{ position: absolute; width: 1.4em; height: 1.4em; right: 0.0; top: -0.0em; line-height: 1;  margin: auto;
background: url("../images/2504/btn_on.png") no-repeat center center / 1%;}
#main.summary .text_slide_wrap.on .slide_click .icon{ background-size: contain;}
#main.summary .text_slide_wrap.on .slide_click .icon img{ opacity: 0;}

#main.summary .slide_target{ text-align: left; font-size: 0.75em; line-height: 1.6; margin-top: 1em; display: none;}
#main.summary .slide_target .text{}
#main.summary .slide_target .text p{ margin-bottom: 0.25em; padding-left: 1em; text-indent: -1em; line-height: 1.4;}

#main.summary .text_slide_wrap2{ margin: 1em auto 2em; max-width: 675px; background: #FFFFE1; border: 1px solid #07C754;}
#main.summary .text_slide_wrap2 .slide_click .text{ color: #07C754; font-size: 0.9em; }
#main.summary .text_slide_wrap2 .slide_click .icon{background: url("../images/2504/btn_on_green.png") no-repeat center center / 1%;}




/**お絵かき用**/
#main canvas{ width:100%; height:100%;}
body.canvas_open{ overflow:hidden;}
body.canvas_close{ overflow:auto;}
body.canvas_open #itimon_ittou {	position:relative; background:#FFF;}


body.canvas_open .canvas_oekaki {width:100%; height:100%; position:absolute;top:0%; left:0%; right:0;margin:auto; max-width:750px;box-sizing:content-box; z-index:6;
}
body.canvas_gray .canvas_oekaki{background: rgba(200,200,200,0.50);}
body.canvas_close .canvas_oekaki{pointer-events: none;}



/**赤シート用**/

#main .redsheet_wrap>a{position:absolute; display:block;}

#main .redsheet_wrap{ position:relative;}
#main .redsheet_wrap .red_sheet{position:absolute; background:#E96563;}
#main .redsheet_wrap .red_sheet::after{ content:""; display:block; position:absolute; top:0; right:0; max-width:10px; max-height:10px; width:70%; height:70%; background:url(./red_sheet/red_sheet_label.jpg) no-repeat right top;background-size: contain; z-index:2}
#main .redsheet_wrap .red_sheet.bk_none::after{ content:"";background: none;width: 0;height: 0;}
#main .redsheet_wrap .red_sheet.bk_none::before{ content:"";background: none;width: 0;height: 0;}
 
#main .redsheet_wrap .red_sheet.no_sankaku::after{ content:"";background: none;width: 0;height: 0;}


#main .redsheet_wrap .red_sheet.skeleton{background:url(./red_sheet/red_sheet_color.png) left top no-repeat; background-size:calc(100% - 10px) 100%}
#main .redsheet_wrap .red_sheet.skeleton::after{ content:""; display:block; position:absolute; top:0; right:0; max-width:10px; max-height:10px; width:70%; height:70%; background:url(./red_sheet/red_sheet_label.png) no-repeat right top;background-size:contain; z-index:2}
#main .redsheet_wrap .red_sheet.skeleton::before{ content:""; display:block; position:absolute; bottom:0; right:0; width:100%; height:calc(100% - 10px); background:url(./red_sheet/red_sheet_color.png); z-index:2}

#main .redsheet_wrap .red_click.off{ opacity:0;}
#main .redsheet_wrap .red_click.off>.red_sheet{ opacity:0;}




#footer,#honban_koukou{ display: none;}


/******************************
	モーダル用ここから
******************************/
.modal_on{overflow:hidden;}

 .modal_data{ position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,0.30); font-size:1em; line-height:1.8; z-index:9;overflow: auto;
display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;
-webkit-box-pack:space-between;-moz-box-pack:space-between;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;
-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;
flex-wrap:wrap;
-moz-transition-property : transform;-webkit-transition-property : transform;-o-transition-property : transform;-ms-transition-property : transform;transition-property : transform;
-moz-transition-duration : 0.4s;-webkit-transition-duration : 0.4;-o-transition-duration : 0.4s;-ms-transition-duration : 0.4s;transition-duration : 0.4s;
-moz-transform: scale(0);-webkit-transform: scale(0);-o-transform: scale(0);-ms-transform: scale(0);transform: scale(0);
}
 .modal_data::before,
 .modal_data::after{ content:""; width:100%; height:50px;}
 .modal_data .modal_wrap{ position:relative; margin:auto; width:100%; max-width: 750px;}
 .modal_data .modal_wrap .modal_close{ position:absolute; right:0.75em; top:0.75em; width:3em; height: 3em; z-index: 5;}
.modal_data .modal_wrap .anime{max-width: 296px; width: 40%; position: absolute; right: 4%; top: 4%; z-index: 4;}
.modal_data .modal_wrap .line_link{ display: block; width: 65%; height: 14%; position: absolute; right:0%; left: 0; bottom: 10%; z-index: 4; margin: auto;}

.modal_data.last_page{}
.modal_data.last_page .modal_wrap{ background: #FFF;}
.modal_data.last_page .modal_wrap .modal_close{ position:absolute; right:0.75em; top:0.75em; width:2em; height: 2em; z-index: 5;}

.modal_data.last_page .modal_wrap .change_img{ position: absolute;width: 9em;right: -0em;top: 3.0em; display: none;}
.modal_data.last_page .modal_wrap .change_img.day1{ position: absolute; width: 6em; right: 1.5em; top: 3.25em; display: none;}
.modal_data.last_page .modal_wrap .modal_link{ width: 90%; margin: 1em auto; display: block;}



.modal_data.last_page .modal_wrap .modal_text_wrap{ font-size: 0.75em; text-align: center; width: 90%; margin: auto;}
.modal_data.last_page .modal_wrap .modal_text_wrap .text_slide_wrap{ background: #FFF; border: 1px solid #000; border-radius: 1em; padding: 1em; margin: 2em auto 0;}
.modal_data.last_page .modal_wrap .modal_text_wrap .slide_click{ position: relative; font-size: 1.2em; padding: 0.0em 2em 0em; line-height: 1.2;}
.modal_data.last_page .modal_wrap .modal_text_wrap .slide_click .text{ color: #005BAC; font-weight: bold; }
.modal_data.last_page .modal_wrap .modal_text_wrap .slide_click .icon{ position: absolute; width: 1.4em; height: 1.4em; right: 0.0; top: -0.0em; line-height: 1;  margin: auto;
background: url("../images/2504/btn_on.png") no-repeat center center / 1%;}
.modal_data.last_page .modal_wrap .modal_text_wrap .text_slide_wrap.on .slide_click .icon{ background-size: contain;}
.modal_data.last_page .modal_wrap .modal_text_wrap .text_slide_wrap.on .slide_click .icon img{ opacity: 0;}

.modal_data.last_page .modal_wrap .modal_text_wrap .slide_target{ text-align: left; font-size: 0.75em; line-height: 1.6; margin-top: 1em; display: none;}
.modal_data.last_page .modal_wrap .modal_text_wrap .slide_target .text{}
.modal_data.last_page .modal_wrap .modal_text_wrap .slide_target .text p{ margin-bottom: 0.25em; padding-left: 1em; text-indent: -1em; line-height: 1.4;}


.modal_data.last_page .modal_wrap .modal_text_wrap .text_slide_wrap1{ margin: 1em auto 2em; max-width: 675px; background: #FFFFE1; border: 1px solid #07C754;}
.modal_data.last_page .modal_wrap .modal_text_wrap .text_slide_wrap1 .slide_click .text{ color: #07C754; font-size: 0.9em; }
.modal_data.last_page .modal_wrap .modal_text_wrap .text_slide_wrap1 .slide_click .icon{background: url("../images/2504/btn_on_green.png") no-repeat center center / 1%;}
/******************************
	モーダル用ここまで
******************************/


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