.story_fl .title_fl {font-family: 'Fredoka One', cursive; }

@media screen and (min-width: 1401px) {
.story_fl { position: relative; width: 768px; margin: 0 auto; padding:120px 0 0 0; }

.story_fl .title_fl { position:relative; font-size:40px; font-weight:400; color:#FFF; padding: 10px 0 10px 80px; background:#EE90A0; border:5px #FFF solid; box-shadow:1px 2px 2px rgba(0,0,0,0.4); border-radius:50px; letter-spacing:8px; width:300px; }
.story_fl .title_fl .cc_ico { position:absolute; bottom:1px; left:3px; width:58px; height:58px; background:url(../images/title/head_tit_ico03.png) no-repeat center center; background-size: 100%;  transition-duration:0.5s;}

.story_line { font-size:20px; font-weight: 500; line-height: 40px; padding: 100px 0 300px 0; }
.sp_s {letter-spacing: -2px;}
.dr {position: relative; }
.rb {position: absolute; top:-25px; left:-5px; font-size: 10px; width:80px; }

#content.story { overflow: hidden; }
	
.intro { font-size:20px; font-weight: 500; line-height: 40px; padding: 30px 0 360px 0; }
.episode { font-size:16px; font-weight: 500; line-height: 40px; padding: 30px 0 60px 0; }

.photo_fl01 { position: absolute; bottom:100px; right:80px; width: 280px; height: 210px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-20deg); }
.photo_fl02 { position: absolute; bottom:100px; left:80px; width: 280px; height: 210px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(20deg); }
#photo_c01 { background-size:100%; }
#photo_c02 { background-size:100%; }

.subtitle_fl { font-size:24px; color:#EE90A0; font-weight:600; }
.staff_l { font-size:13px; color:#EE90A0; border-bottom: 2px dotted #EE90A0; }

.story_menu { padding: 30px 0 10px 0; }
.ff_btm_fl { float: left; width: 100px; background-size:100%; background: #FFF; border: 3px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); margin: 0 0 30px 0; transition-duration: 0.5s; }
a:hover .ff_btm_fl { background:#EE90A0; border: 3px solid #EE90A0; }
a .ff_btm_fl p { font-size: 14px; color:#EE90A0; text-decoration: none; text-align: center; padding: 5px 0; }
a:hover .ff_btm_fl p { font-size: 14px; color:#FFF; text-decoration: none; text-align: center; padding: 5px 0; }
.ff_btm_fl_bl { float: left; width: 100px; height: 100px; transition-duration: 0.5s; }
.thimg_fl {}
.thimg_fl img { width: 100px;}
.btm_rotate01 { transform: rotate(6deg); }
.btm_rotate02 { transform: rotate(-6deg); }

#epi_photp_wfl { position: relative; width: 100%; height: 600px; }
.epi_photo_fl01 { position: absolute; bottom:360px; right:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl02 { position: absolute; bottom:360px; left:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl03 { position: absolute; bottom:180px; right:30px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl04 { position: absolute; bottom:180px; left:30px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl05 { position: absolute; bottom:0; right:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(20deg); }
.epi_photo_fl06 { position: absolute; bottom:0; left:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl01 img { width:280px; }
.epi_photo_fl02 img { width:280px; }
.epi_photo_fl03 img { width:280px; }
.epi_photo_fl04 img { width:280px; }
.epi_photo_fl05 img { width:280px; }
.epi_photo_fl06 img { width:280px; }

br.pc_r {}
br.mb_r { display: none; }
}


@media all and (min-width: 769px) and (max-width: 1400px) {
.story_fl { position: relative; width: 768px; margin: 0 auto; padding:120px 0 0 0 }

.story_fl .title_fl { position:relative; font-size:40px; font-weight:400; color:#FFF; padding: 10px 0 10px 80px; background:#EE90A0; border:5px #FFF solid; box-shadow:1px 2px 2px rgba(0,0,0,0.4); border-radius:50px; letter-spacing:8px; width:300px; }
.story_fl .title_fl .cc_ico { position:absolute; bottom:1px; left:3px; width:58px; height:58px; background:url(../images/title/head_tit_ico03.png) no-repeat center center; background-size: 100%;  transition-duration:0.5s;}

.story_line { font-size:20px; font-weight: 500; line-height: 40px; padding: 100px 0 300px 0; }
.sp_s {letter-spacing: -2px;}
.dr {position: relative; }
.rb {position: absolute; top:-25px; left:-5px; font-size: 10px; width:80px; }

#content.story { overflow: hidden; }

.intro { font-size:20px; font-weight: 500; line-height: 40px; padding: 30px 0 360px 0; }
.episode { font-size:16px; font-weight: 500; line-height: 40px; padding: 30px 0 60px 0; }

.photo_fl01 { position: absolute; bottom:20px; right:80px; width: 280px; height: 210px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-20deg); }
.photo_fl02 { position: absolute; bottom:20px; left:80px; width: 280px; height: 210px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(20deg); }
#photo_c01 { background-size:100%; }
#photo_c02 { background-size:100%; }

.subtitle_fl { font-size:24px; color:#EE90A0; font-weight:600; }
.staff_l { font-size:13px; color:#EE90A0; border-bottom: 2px dotted #EE90A0; }
.story_menu { padding: 30px 0 10px 0; }
.ff_btm_fl { float: left; width: 100px; background-size:100%; background: #FFF; border: 3px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); margin: 0 0 30px 0; transition-duration: 0.5s; }
a:hover .ff_btm_fl { background:#EE90A0; border: 3px solid #EE90A0; }
a .ff_btm_fl p { font-size: 14px; color:#EE90A0; text-decoration: none; text-align: center; padding: 5px 0; }
a:hover .ff_btm_fl p { font-size: 14px; color:#FFF; text-decoration: none; text-align: center; padding: 5px 0; }
.ff_btm_fl_bl { float: left; width: 100px; height: 100px; transition-duration: 0.5s; }
.thimg_fl {}
.thimg_fl img { width: 100px;}
.btm_rotate01 { transform: rotate(6deg); }
.btm_rotate02 { transform: rotate(-6deg); }

#epi_photp_wfl { position: relative; width: 100%; height: 600px; }
.epi_photo_fl01 { position: absolute; bottom:360px; right:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl02 { position: absolute; bottom:360px; left:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl03 { position: absolute; bottom:180px; right:30px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl04 { position: absolute; bottom:180px; left:30px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl05 { position: absolute; bottom:0; right:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(20deg); }
.epi_photo_fl06 { position: absolute; bottom:0; left:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl01 img { width:280px; }
.epi_photo_fl02 img { width:280px; }
.epi_photo_fl03 img { width:280px; }
.epi_photo_fl04 img { width:280px; }
.epi_photo_fl05 img { width:280px; }
.epi_photo_fl06 img { width:280px; }

br.pc_r {}
br.mb_r { display: none; }
}


@media all and (min-width: 501px) and (max-width: 768px) {
.story_fl { position: relative; width:660px; margin: 0 auto; padding:120px 0 0 0; }

.story_fl .title_fl { position:relative; font-size:35px; font-weight:400; color:#FFF; padding: 10px 0 10px 70px; background:#EE90A0; border:5px #FFF solid; box-shadow:1px 2px 2px rgba(0,0,0,0.4); border-radius:50px; letter-spacing:8px; width:280px; }
.story_fl .title_fl .cc_ico { position:absolute; bottom:0px; left:2px; width:55px; height:55px; background:url(../images/title/head_tit_ico03.png) no-repeat center center; background-size: 100%;  transition-duration:0.5s;}

.story_line { font-size:18px; font-weight: 500; line-height: 40px; padding: 100px 0 300px 0; }
.sp_s {letter-spacing: -2px;}
.dr {position: relative; }
.rb {position: absolute; top:-25px; left:-5px; font-size: 10px; width:80px; }

#content.story { overflow: hidden; }

.intro { font-size:20px; font-weight: 500; line-height: 40px; padding: 30px 0 360px 0; }
.episode { font-size:16px; font-weight: 500; line-height: 40px; padding: 30px 0 60px 0;}

.photo_fl01 { position: absolute; bottom:20px; right:80px; width: 280px; height: 210px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-20deg); }
.photo_fl02 { position: absolute; bottom:20px; left:80px; width: 280px; height: 210px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(20deg); }
#photo_c01 { background-size:100%; }
#photo_c02 { background-size:100%; }

.subtitle_fl { font-size:24px; color:#EE90A0; font-weight:600; }
.staff_l { font-size:13px; color:#EE90A0; border-bottom: 2px dotted #EE90A0; }

.story_menu { padding: 30px 0 10px 0; }
.ff_btm_fl { float: left; width: 100px; background-size:100%; background: #FFF; border: 3px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); margin: 0 0 30px 0; transition-duration: 0.5s; }
a:hover .ff_btm_fl { background:#EE90A0; border: 3px solid #EE90A0; }
a .ff_btm_fl p { font-size: 14px; color:#EE90A0; text-decoration: none; text-align: center; padding: 5px 0; }
a:hover .ff_btm_fl p { font-size: 14px; color:#FFF; text-decoration: none; text-align: center; padding: 5px 0; }
.ff_btm_fl_bl2 { float: left; width: 100px; height: 100px; transition-duration: 0.5s; }
.thimg_fl {}
.thimg_fl img { width: 100px;}
.btm_rotate01 { transform: rotate(6deg); }
.btm_rotate02 { transform: rotate(-6deg); }

#epi_photp_wfl { position: relative; width: 100%; height: 600px; }
.epi_photo_fl01 { position: absolute; bottom:360px; right:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl02 { position: absolute; bottom:360px; left:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl03 { position: absolute; bottom:180px; right:30px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl04 { position: absolute; bottom:180px; left:30px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl05 { position: absolute; bottom:0; right:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(20deg); }
.epi_photo_fl06 { position: absolute; bottom:0; left:80px; width: 280px; height: 157px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl01 img { width:280px; }
.epi_photo_fl02 img { width:280px; }
.epi_photo_fl03 img { width:280px; }
.epi_photo_fl04 img { width:280px; }
.epi_photo_fl05 img { width:280px; }
.epi_photo_fl06 img { width:280px; }

.story_wfl { width:680px;}

br.pc_r {}
br.mb_r { display: none; }
}


@media screen and (max-width: 500px) {
.story_fl { position: relative; width: 440px; margin: 0 auto; padding:120px 30px 0 30px; }

.story_fl .title_fl { position:relative; font-size:30px; font-weight:400; color:#FFF; padding: 10px 0 10px 80px; background:#EE90A0; border:5px #FFF solid; box-shadow:1px 2px 2px rgba(0,0,0,0.4); border-radius:50px; letter-spacing:8px; width:300px; }
.story_fl .title_fl .cc_ico { position:absolute; bottom:0px; left:2px; width:49px; height:49px; background:url(../images/title/head_tit_ico03.png) no-repeat center center; background-size: 100%;  transition-duration:0.5s;}

.story_line { font-size:16px; font-weight: 500; line-height: 40px; padding: 100px 20px 400px 20px; }
.story_line br { display: none; }
.sp_s {letter-spacing: -2px;}
.dr {position: relative; }
.rb {position: absolute; top:-25px; left:-5px; font-size: 10px; width:80px; }

#content.story { overflow: hidden; }

.intro { font-size:20px; font-weight: 500; line-height: 40px; padding: 30px 0 360px 0; word-wrap: break-word; }
.episode { font-size:16px; font-weight: 500; line-height: 40px; padding: 30px 0 60px 0; word-wrap: break-word; }

.photo_fl01 { position: absolute; bottom:200px; right:80px; width: 240px; height: 180px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-20deg); }
.photo_fl02 { position: absolute; bottom:50px; left:80px; width: 240px; height: 180px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(20deg); }
#photo_c01 { background-size:100%; }
#photo_c02 { background-size:100%; }

.subtitle_fl { font-size:24px; color:#EE90A0; font-weight:600; }
.staff_l { font-size:13px; color:#EE90A0; border-bottom: 2px dotted #EE90A0; }

.story_menu { padding: 30px 0 10px 0; }
.ff_btm_fl { float: left; width: 100px; background-size:100%; background: #FFF; border: 3px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); margin: 0 0 30px 0; transition-duration: 0.5s; }
a:hover .ff_btm_fl { background:#EE90A0; border: 3px solid #EE90A0; }
a .ff_btm_fl p { font-size: 14px; color:#EE90A0; text-decoration: none; text-align: center; padding: 5px 0; }
a:hover .ff_btm_fl p { font-size: 14px; color:#FFF; text-decoration: none; text-align: center; padding: 5px 0; }
.ff_btm_fl_bl3 { float: left; width: 100px; height: 100px; transition-duration: 0.5s; }
.thimg_fl {}
.thimg_fl img { width: 100px;}
.btm_rotate01 { transform: rotate(6deg); }
.btm_rotate02 { transform: rotate(-6deg); }

#epi_photp_wfl { position: relative; width: 100%; height: 900px; }
.epi_photo_fl01 { position: absolute; bottom:700px; right:40px; width: 240px; height: 135px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl02 { position: absolute; bottom:560px; left:40px; width: 240px; height: 135px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl03 { position: absolute; bottom:420px; right:40px; width: 240px; height: 135px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl04 { position: absolute; bottom:280px; left:40px; width: 240px; height: 135px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl05 { position: absolute; bottom:140px; right:40px; width: 240px; height: 135px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(10deg); }
.epi_photo_fl06 { position: absolute; bottom:0; left:40px; width: 240px; height: 135px; background-size:100%; background: #CCC; border: 5px solid #FFF; box-shadow:1px 2px 2px rgba(0,0,0,0.4); z-index: 0; transform: rotate(-10deg); }
.epi_photo_fl01 img { width:240px; }
.epi_photo_fl02 img { width:240px; }
.epi_photo_fl03 img { width:240px; }
.epi_photo_fl04 img { width:240px; }
.epi_photo_fl05 img { width:240px; }
.epi_photo_fl06 img { width:240px; }

.story_wfl { width:440px;}

br.pc_r { display: none; }
br.mb_r {}
}


@media screen and (min-width: 1401px) {
#story_data { min-width:760px; max-width:760px; }
.sliderPro {width:760px;  }
.sp-slide { min-height:760px;}
}
@media all and (min-width: 769px) and (max-width: 1400px) {
#story_data { min-width:760px; max-width:760px;}
.sliderPro { width:700px;  }
.sp-slide { min-height:600px;}
}
@media all and (min-width: 501px) and (max-width: 768px) {
#story_data { min-width:760px; max-width:760px;}
.sliderPro { width:700px;  }
.sp-slide { min-height:600px;}
}
@media screen and (max-width: 500px) {
#story_data { min-width:500px; max-width:500px; }
.sliderPro { width:500px; }
.sp-slide { min-height:860px;}
}