@charset "UTF-8";

/*-------------------------------------------------------------------
 *
 * File Name   : fun_new.css

-------------------------------------------------------------------*/
#fun { }

#fun #fun_contents { position:relative; font-size:14px; line-height:1.6; }
#fun #fun_contents a:hover img { opacity:0.8; filter:alpha(opacity=80); }

#fun .topicpath { }
#fun .topicpath ul { }
#fun .topicpath ul li { display:inline-block; font-size:12px; padding-left:15px; }
#fun .topicpath ul li:first-child { padding-left:0; }
#fun .topicpath a { display:table-row; color:#2a58b1; }
#fun .topicpath a:before { display:table-cell; content:url(/img/fun/icon_link_01.gif); position:relative; top:0.25em; padding-right:7px; }
#fun .topicpath li.act a { text-decoration:none; cursor:default; }


/* @group overlay --------------------------- */
#overlay{ position:absolute; z-index:6; display:none; background-color:#000; opacity:0.5; filter:alpha(opacity=50); }
#popupflash { position:absolute; z-index:10; display:none; width:940px; height:920px; }
#popupflash .close { position:absolute; right:25px; top:25px; }
#popupflash .close a:hover img { opacity:0.8; filter:alpha(opacity=80); }


/* @group ie8 --------------------------- */
html>/**/body #fun_contents a:hover img { background-color/*\**/:#f9feff\9; }
body:not(:target) #fun_contents a:hover img { background-color:transparent\9; }


/*===================================================================
	contents
===================================================================*/
#fun .detail_head { position:relative; display:table; width:100%; height:80px; margin-top:0px; background-color:#dcf2ff; border-radius:5px; }
#fun .detail_head .ttl { display:table-cell; vertical-align:middle; padding:7px 35px 3px 35px; font-size:26px; font-weight:bold; line-height:1.25; color:#486ec5; }
#fun .detail_head .icon { position:absolute; right:25px; top:23px; }

#fun .detail_main { margin-top:15px; }
#fun .detail_main a { color:#2a58b1; }

#fun .detail_main .list01 > li { display:table; }
#fun .detail_main .list01 > li:before { display:table-cell; content:"・"; padding-right:0.3em; vertical-align:top; }

#fun .detail_main .note01 { font-size:12px; }
#fun .detail_main .note01 > li { margin-top:5px; padding-left:1em; text-indent:-1em; }
#fun .detail_main p.note01 { margin-top:5px; padding-left:1em; text-indent:-1em; }


/* @group main_col --------------------------- */
#fun .detail_main .main_col { width:width:100%; }
#fun .detail_main .main_col .frame { padding-top:30px; background-color:transparent; border-radius:5px; }
#fun .detail_main .main_col .frame_inner { padding:0 35px 30px 35px; }

#fun .detail_main .main_col .post h2.ttl { font-size:24px; font-weight:bold; color:#2a58b1; }
#fun .detail_main .main_col .post .lead01 { margin-top:15px; }
#fun .detail_main .main_col .post .lead01 p { margin-top:15px; }
#fun .detail_main .main_col .post .lead01 p:first-child { margin-top:0; }

#fun .detail_main .main_col .post .body { margin-top:30px; }
#fun .detail_main .main_col .post .body:first-child { margin-top:0; }

#fun .detail_main .main_col .post .body .ttl { font-size:20px; font-weight:bold; color:#2a58b1; }
#fun .detail_main .main_col .post .body .img { width:auto; margin-top:15px; text-align:center; }

#fun .detail_main .main_col .post .body dl.ingredients { margin-top:15px; padding:0 20px; }
#fun .detail_main .main_col .post .body dl.ingredients dt { font-weight:bold; color:#486ec5; }
#fun .detail_main .main_col .post .body dl.ingredients dd { margin-top:5px; }
#fun .detail_main .main_col .post .body dl.ingredients dd ul { }
#fun .detail_main .main_col .post .body dl.ingredients dd ul li.left_col { display:inline-block; vertical-align:top; }
#fun .detail_main .main_col .post .body dl.ingredients dd ul li.bold { font-weight: bold; }
#fun .detail_main .main_col .post .body dl.ingredients dd ul li.right_col { display:inline-block; vertical-align:top; padding-left:30px; }

#fun .detail_main .main_col .post .body dl.ingredients .overview { }
#fun .detail_main .main_col .post .body dl.ingredients .overview th { padding-left:1em; text-indent:-1em; vertical-align:top; padding-right:20px; white-space:nowrap; }
#fun .detail_main .main_col .post .body dl.ingredients .overview td { vertical-align:top; }

#fun .detail_main .main_col .post .body dl.howto { margin-top:15px; border-radius:5px; background-color:#dcf2ff; }
#fun .detail_main .main_col .post .body dl.howto dt { padding:15px 20px 0 20px; font-weight:bold; color:#486ec5; }
#fun .detail_main .main_col .post .body dl.howto dd { padding:5px 20px 15px 20px; }
#fun .detail_main .main_col .post .body dl.howto dd .list { }
#fun .detail_main .main_col .post .body dl.howto dd .list li { padding-left:1em; text-indent:-1em; }
#fun .detail_main .main_col .post .body dl.howto dd .list li span { color:#486ec5; }

#fun .detail_main .main_col .post .body .txt01 { margin-top:15px; }



#fun .detail_main .main_col .post .summary { margin-top:50px; }
#fun .detail_main .main_col .post .summary p { margin-top:15px; font-size:16px; }
#fun .detail_main .main_col .post .summary p:first-child { margin-top:0; }
#fun .detail_main .main_col .post .summary p em { font-weight:bold; }
#fun .detail_main .main_col .post .summary ul.note01 { margin-top:15px; font-size:100%; }
#fun .detail_main .main_col .post .summary ul.note01 li { padding-left:1em; text-indent:-1em; }
#fun .detail_main .main_col .post .summary ul.note01 li em { font-weight:bold; }

#fun .detail_main .main_col .pagination { margin-top:15px; }
#fun .detail_main .main_col .pagination ul { }
#fun .detail_main .main_col .pagination ul li { width:316px; }
#fun .detail_main .main_col .pagination ul li.prev { float:left; }
#fun .detail_main .main_col .pagination ul li.next { float:right; text-align:right; text-align:-webkit-right; }

#fun .detail_main .main_col .pagination ul li.prev span { display:inline-block; }
#fun .detail_main .main_col .pagination ul li.prev span a { display:table-row; }
#fun .detail_main .main_col .pagination ul li.prev span a:before { display:table-cell; content:url(/img/fun/icon_link_02.gif); position:relative; top:0.15em; padding-right:7px; }
#fun .detail_main .main_col .pagination ul li.next span a { display:table-row; }
#fun .detail_main .main_col .pagination ul li.next span a:after { display:table-cell; content:url(/img/fun/icon_link_01.gif); position:relative; top:0.15em; padding-left:7px; }

#fun .detail_main .main_col .share { width:645px; margin:50px auto 0 auto; }
#fun .detail_main .main_col .share ul {}
#fun .detail_main .main_col .share ul li.left_col { float:left; width:316px; }
#fun .detail_main .main_col .share ul li.right_col { float:right; width:316px; }


/* @group sub_col --------------------------- */
#fun .detail_main .sub_col { }


/* @group rank --------------------------- */
#fun .detail_main .rank { margin-top:40px; }
#fun .detail_main .rank .ttl { padding:0 20px; background-color:#fcdb74; border-radius:5px 5px 0 0; }
#fun .detail_main .rank .rank_inner { padding:20px; background-color:#fff; border-radius:0 0 5px 5px; }

#fun .detail_main .rank .list { }
#fun .detail_main .rank .list li { margin-top:15px; padding-top:15px; border-top: dotted #eee 2px; }
#fun .detail_main .rank .list li:first-child { margin-top:0; padding-top:0; border-top:none 0; }
#fun .detail_main .rank .list li a { color:#144097; }
#fun .detail_main .rank .list li .article { display:table; }
#fun .detail_main .rank .list li .article .img { display:table-cell; vertical-align:top; padding-right:20px; }
#fun .detail_main .rank .list li .article .txt { display:table-cell; vertical-align:top; }
#fun .detail_main .rank .list li .article .txt .icon,
#fun .detail_main .rank .list li .article .txt .sub,
#fun .detail_main .rank .list li .article .txt .main { display:block; }

#fun .detail_main .rank .list li .article .txt .icon { margin-bottom:15px; }
#fun .detail_main .rank .list li .article .txt .icon img { width:65px; height:auto; }
#fun .detail_main .rank .list li .article .txt .main { width:100%; font-size:16px; }
#fun .detail_main .rank .list li .article .txt .main em { display:block; width:100%; font-weight:bold; }
#fun .detail_main .rank .list li .article .txt .main br { display:none; }

#fun .detail_main .rank .list li.no1 .article .txt .icon { height:30px; background:url(/img/fun/rank_num_01.gif) no-repeat left top; }
#fun .detail_main .rank .list li.no2 .article .txt .icon { height:30px; background:url(/img/fun/rank_num_02.gif) no-repeat left top; }
#fun .detail_main .rank .list li.no3 .article .txt .icon { height:30px; background:url(/img/fun/rank_num_03.gif) no-repeat left top; }
#fun .detail_main .rank .list li.no4 .article .txt .icon { height:30px; background:url(/img/fun/rank_num_04.gif) no-repeat left top; }
#fun .detail_main .rank .list li.no5 .article .txt .icon { height:30px; background:url(/img/fun/rank_num_05.gif) no-repeat left top; }


/* @group eat01 --------------------------- */
#fun.eat01 { }


/* @group eat02 --------------------------- */
#fun.eat02 { }


/* @group eat03 --------------------------- */
#fun.eat03 { }
#fun.eat03 .post .body dl.ingredients ul { }
#fun.eat03 .post .body dl.ingredients ul li.auto { width:auto; }
#fun.eat03 .post .body dl.ingredients ul li.auto .overview th { width:1em; }
#fun.eat03 .post .body dl.ingredients ul li.auto .overview td.note { padding-left:1em; }
#fun.eat03 .post .body dl.ingredients ul li.auto .overview td.note p { padding-left:1em; text-indent:-1em; font-size:12px; }

#fun.eat03 .post .body.line01 { padding-bottom:30px; border-bottom:#d2d2d2 solid 2px; }


/* @group goout01 --------------------------- */
#fun.goout01 { }
#fun.goout01 .post .body dl.ingredients dd ul li.right_col { width:530px; }
#fun.goout01 .post .body dl.ingredients dd ul li.right_col .overview.sp { display:none; }


/* @group goout02 --------------------------- */
#fun.goout02 { }
#fun.goout02 .post .summary dl.info { margin-top:15px; background-color:#eee; border-radius:5px; }
#fun.goout02 .post .summary dl.info dt { padding:15px 20px 0 20px; font-weight:bold; }
#fun.goout02 .post .summary dl.info dd { padding:5px 20px 15px 20px; }
#fun.goout02 .post .summary dl.info p { margin-top:0; font-size:inherit !important; }

#fun.goout02 .link_win a img.icon { display:inline-block; vertical-align:0.1em; padding-left:0.25em; }


/* @group learn01 --------------------------- */
#fun.learn01 { }

#fun.learn01 .book.pc { display:block; width:553px; height:425px; margin:20px auto 0 auto; padding:5px 11px 0 12px; background:url(/img/fun/book_bg_01.gif) no-repeat left top; }
#fun.learn01 .book.pc .book_inner { position:relative; left:0; top:0; width:552px; height:387px; overflow:hidden; }
#fun.learn01 .book.pc .rot { position:absolute; left:0; top:0; }
#fun.learn01 .book.pc .rot li { float:left; width:552px; }
#fun.learn01 .book.pc .arrow { position:relative; left:0; top:0; z-index:5; }
#fun.learn01 .book.pc .arrow li { position:absolute; }
#fun.learn01 .book.pc .arrow li.prev { left:220px; top:15px; }
#fun.learn01 .book.pc .arrow li.next { right:225px; top:15px; }
#fun.learn01 .book.pc .num { margin-top:15px; font-family:Arial, Helvetica, sans-serif; font-size:117%; color:#2a58b1; letter-spacing:2px; text-align:center; }

#fun.learn01 .book.sp { display:none; }

#fun.learn01 .char { width:575px; margin:30px auto 0 auto; padding-bottom:30px; background-color:#fef8ea; overflow:hidden; border-radius:5px; }
#fun.learn01 .char .ttl { }
#fun.learn01 .char ul { margin-top:-10px; padding:0 10px; text-align:center; }
#fun.learn01 .char ul li { display:inline-block; vertical-align:top; width:165px; padding:10px 10px 0 10px; }
#fun.learn01 .char ul li dl { margin-top:15px; text-align:left; }
#fun.learn01 .char ul li dl dt { font-weight:bold; color:#2a58b1; text-align:center; }
#fun.learn01 .char ul li dl dd { font-size:13px; text-align:justify; text-justify:inter-ideograph; }

#fun.learn01 .txt01 { margin-top:20px; }


/* @group learn02 --------------------------- */
#fun.learn02 { }

#fun.learn02 .lead01 { margin:0 15px 0 15px; }
#fun.learn02 .lead01 p { margin-top:15px; }
#fun.learn02 .lead01 p:first-child { margin-top:0; }

#fun.learn02 .stage { width:545px; margin:30px auto 0 auto; }
#fun.learn02 .stage .mov { width:540px; height:304px; margin-top:0; padding:3px 2px 3px 3px; background:url(/img/fun/stage_bg_01.gif) no-repeat left top; overflow:hidden; }

#fun.learn02 .char { width:575px; margin:30px auto 0 auto; padding-bottom:30px; background-color:#fef8ea; overflow:hidden; border-radius:5px; }
#fun.learn02 .char .ttl { }
#fun.learn02 .char ul { margin-top:-10px; padding:0 10px; text-align:center; }
#fun.learn02 .char ul li { display:inline-block; vertical-align:top; width:165px; padding:10px 10px 0 10px; }
#fun.learn02 .char ul li dl { margin-top:15px; text-align:left; }
#fun.learn02 .char ul li dl dt { font-weight:bold; color:#2a58b1; text-align:center; }
#fun.learn02 .char ul li dl dd { font-size:13px; text-align:justify; text-justify:inter-ideograph; }


/* @group learn03 --------------------------- */
#fun.learn03 { }

#fun.learn03 .post .body dl.point { margin-top:15px; }
#fun.learn03 .post .body dl.point dt { font-weight:bold; }
#fun.learn03 .post .body dl.point dd .txt01 { margin-top:0; }

#fun.learn03 .post .summary { min-height:90px; padding-right:120px; background:url(/img/fun/learn03_bg_01.gif) no-repeat right bottom; }
#fun.learn03 .post .wp_logo { margin-top:15px; text-align:right; }


/* @group learn04 --------------------------- */
#fun.learn04 { }

#fun.learn04 .post .summary { min-height:90px; padding-right:120px; background:url(/img/fun/learn04_bg_01.gif) no-repeat right bottom; }
#fun.learn04 .post .wp_logo { margin-top:15px; text-align:right; }


/* @group learn05 --------------------------- */
#fun.learn05 { }

#fun.learn05 .post .body div.point { margin-top:30px; }
#fun.learn05 .post .body div.point ul li { float:right; width:340px; }
#fun.learn05 .post .body div.point ul li:first-child { float:left; width:515px; }

#fun.learn05 .post .body div.point ul li h4.ttl { font-weight:bold; font-size:16px; color:#333; }
#fun.learn05 .post .body div.point ul li h4.ttl + .txt01 { margin-top:5px; }
#fun.learn05 .post .body div.point ul li p:first-child { margin-top:0; }
#fun.learn05 .post .body div.point ul li p.img img { width:100%; height:auto; }


/* @group learn06 --------------------------- */
#fun.learn06 { }

#fun.learn06 .post .body ol { padding-left: 20px; margin:30px 0px; }
#fun.learn06 .post .body ol li { list-style: decimal; margin-top: 15px; }
#fun.learn06 .post .body ol li:first-child { margin-top: 0px; }
#fun.learn06 .post .body p.answer {  margin-top:10px; font-size: 20px; font-weight: bold; }
#fun.learn06 .detail_main .main_col .frame_inner .post  dd.learn_img { margin-top: 3px; }
#fun.learn06 .detail_main .main_col .frame_inner .post  dt.frozen { margin-left: 125px; }
#fun.learn06 .body p.txt01 a:after { content:url(/img/fun/icon_link_01.gif); position: relative; top: 2.15px; padding-left: 7px; }
#fun.learn06 .summary p a:after { content:url(/img/fun/icon_link_01.gif); position: relative; top: 2.15px; padding-left: 7px; }


/* @group learn07 --------------------------- */
#fun.learn07 { }

#fun.learn07 .post .body.line01 h4 { margin-top: 30px; line-height: 1.25; }
#fun.learn07 .post .body.line01 { padding-bottom: 30px; border-bottom: #d2d2d2 solid 2px; }
#fun.learn07 .post .body p.name { font-weight: bold; color: #486ec5; }
#fun.learn07 .detail_main .main_col .post .body .img { margin-bottom: 15px; }
#fun.learn07 .post .summary { min-height: 90px; padding-right: 120px; background: url(/img/fun/learn04_bg_01.gif) no-repeat right bottom; }
#fun.learn07 .post .wp_logo { margin-top: 15px; text-align: right; }


/* @group learn08 --------------------------- */
#fun.learn08 { }

#fun.learn08 .post .line01 { margin-bottom: 30px; padding-bottom: 30px; border-bottom: #d2d2d2 solid 2px; }
#fun.learn08 .post .body .mini_txt { font-size: 75%; }
#fun.learn08 .post .body .advisor_box { margin-top:15px; padding: 15px 20px; border-radius: 5px; background-color: #c4eaff; }
#fun.learn08 .post .body .advisor_box p { display: inline-block; vertical-align: middle; }
#fun.learn08 .post .body .advisor_box .adv_name { width: 600px; padding-left: 20px; }
#fun.learn08 .post .body .advisor_box .adv_name span { font-size: 130%; font-weight: bold; color: #2a58b1; }
#fun.learn08 .post .body .question dt { display: inline-block; padding: 20px 0; }
#fun.learn08 .post .body .question dd { display: inline-block; width: 580px; vertical-align: top; }
#fun.learn08 .post .body .point { padding: 15px; border: 2px solid #c4eaff; border-radius: 20px; }
#fun.learn08 .post .body .point dt { position: relative; display: inline-block; padding: 5%; border-radius: 50%; background-color: #c4eaff; vertical-align: middle; }
#fun.learn08 .post .body .point dt span { position: absolute; left: 0; top: 50%; margin: -.6em 0 0; width: 100%; text-align: center; color: #2a58b1; }
#fun.learn08 .post .body .point dd { display: inline-block; width: 85%; padding-left: 3%; vertical-align: middle; }
#fun.learn08 .post .body .anchor { font-size: 0; }
#fun.learn08 .post .body .anchor li { display: inline-block; width: 30%; margin: 0 1.65%; }
#fun.learn08 .post .body.conbox_02 .img { margin-top: 30px; }
#fun.learn08 .post .body .attention { padding: 0 45px; }
#fun.learn08 .post .body .attention h4 { margin: 20px auto 10px; }
#fun.learn08 .post .body .attention .mini_txt { margin-top: 5px; text-align: right; }
#fun.learn08 .post .summary { min-height: 90px; padding-right: 120px; background: url(/img/fun/learn04_bg_01.gif) no-repeat right bottom; }
#fun.learn08 .post .wp_logo { margin-top: 15px; text-align: right; }


/* @group learn09 --------------------------- */
#fun.learn09 .post .body.line01 { padding-bottom: 30px; border-bottom: #d2d2d2 solid 2px; }
#fun.learn09 .post .body .ttl.question { padding-left: 2em; text-indent: -2em; }
#fun.learn09 .post .body .answer { margin-top: 15px; padding-left: 2em; text-indent: -2em; font-size: 20px; font-weight: bold; }
#fun.learn09 .post .body .item { margin-top: 15px; font-size: 20px; font-weight: bold; color: #486ec5; }
#fun.learn09 .post .body .lead01 span { color: #486ec5; }
#fun.learn09 .post .body .point dl { padding: 2%; border: 3px solid #dcf2ff; border-radius: 25px; color: #486ec5; }
#fun.learn09 .post .body .point dl dt { display: inline-block; width: 12%; padding: 3% 2%; vertical-align: middle; background-color: #dcf2ff; }
#fun.learn09 .post .body .point dl dd { display: inline-block; width: 79%; margin: 0 0 0 2%; padding-left: 1em; text-indent: -1em; vertical-align: middle; font-size: 18px; }
#fun.learn09 .post .body .reference li { padding-left: 1.3em; text-indent: -1.3em; }

/* @group play01 --------------------------- */
#fun.play01 { }

#fun.play01 .lead01 { margin:0 15px 0 15px; }

#fun.play01 .stage { width:545px; margin:30px auto 0 auto; }
#fun.play01 .stage .mov { width:540px; height:304px; margin-top:10px; padding:3px 2px 3px 3px; background:url(/img/fun/play/stage_bg_01.gif) no-repeat left top; overflow:hidden; }

#fun.play01 .stage.stage01 { }
#fun.play01 .stage.stage02 { width:545px; margin:30px auto 0 auto; padding:110px 15px 0 15px; background:url(/img/fun/play01_bg_01.gif) no-repeat center top; }

#fun.play01 .char { width:575px; margin:30px auto 0 auto; padding-bottom:30px; background-color:#fef8ea; overflow:hidden; border-radius:5px; }
#fun.play01 .char .ttl { }
#fun.play01 .char ul { margin-top:-10px; padding:0 10px; text-align:center; }
#fun.play01 .char ul li { display:inline-block; vertical-align:top; width:165px; padding:10px 10px 0 10px; }
#fun.play01 .char ul li dl { margin-top:15px; text-align:left; }
#fun.play01 .char ul li dl dt { font-weight:bold; color:#2a58b1; text-align:center; }
#fun.play01 .char ul li dl dd { font-size:13px; text-align:justify; text-justify:inter-ideograph; }


/* @group play02 --------------------------- */
#fun.play02 .detail_main .main_col p br.pc{ display:block; }
#fun.play02 .detail_main .main_col .post #how_to { margin: 30px 0 50px;}
#fun.play02 .detail_main .main_col .post #how_to h2 { color:#f62737;}
#fun.play02 .detail_main .main_col .post #how_to p { margin: 10px 0;}
#fun.play02 .detail_main .main_col .post #how_to p span.indent { text-indent:-1em; }
#fun.play02 .detail_main .main_col .post #how_to .cont { margin: 30px 0;}
#fun.play02 .detail_main .main_col .post #how_to .cont p { margin: 10px 0;}
#fun.play02 .detail_main .main_col .post #how_to .modal input:disabled { opacity:0; }
#fun.play02 .detail_main .main_col .post #how_to p.img .open-modal { margin-top: 20px; }
#fun.play02 .detail_main .main_col .post #bifi_dance{ background-color: #f6e3ce; border-radius: 30px; padding: 20px 0; }
#fun.play02 .detail_main .main_col .post #bifidus_book{ background-color: #cef6d8;  border-radius: 30px; padding: 20px 0; }
#fun.play02 .detail_main .main_col .post #bifi_dance .cont_inner,
#fun.play02 .detail_main .main_col .post #bifidus_book .cont_inner{ padding: 10px 20px; }
#fun.play02 .detail_main .main_col .post .pc #bifi_dance .left,
#fun.play02 .detail_main .main_col .post .pc #bifi_dance .image,
#fun.play02 .detail_main .main_col .post .pc #bifidus_book .left,
#fun.play02 .detail_main .main_col .post .pc #bifidus_book .image{ width: 400px; display: inline-block; vertical-align:top; }
#fun.play02 .detail_main .main_col .post #bifi_dance .left,
#fun.play02 .detail_main .main_col .post #bifidus_book .left{ margin-right: 10px; }
#fun.play02 .detail_main .main_col .post #bifi_dance dt{ color: #ff7f50; font-size: 24px; font-weight: bold; }
#fun.play02 .detail_main .main_col .post #bifidus_book dt{ color: #66cdaa; font-size: 24px; font-weight: bold; }
#fun.play02 .detail_main .main_col .post .pc #bifi_dance .link_btn,
#fun.play02 .detail_main .main_col .post .pc #bifidus_book .link_btn{ width: 100%; margin: 56px auto 0px; background-color: #053f8e; border-radius: 5px; }
#fun.play02 .detail_main .main_col .post #bifi_dance .link_btn a,
#fun.play02 .detail_main .main_col .post #bifidus_book .link_btn a{ display: block; padding: 20px; position: relative;}
#fun.play02 .detail_main .main_col .post .pc #bifi_dance .link_btn a::after,
#fun.play02 .detail_main .main_col .post .pc #bifidus_book .link_btn a::after{ border-right: 4px solid #ffffff; border-top: 4px solid #ffffff; content: ""; height: 14px; position: absolute; right: 18px; top: 50%; transform: translateY(-50%) rotate(45deg); transition: all .5s ease; width: 14px; }
#fun.play02 .detail_main .main_col .post #bifi_dance .link_btn:hover,
#fun.play02 .detail_main .main_col .post #bifidus_book .link_btn:hover{ opacity:0.7; }
#fun.play02 .detail_main .main_col .post #bifi_dance p,
#fun.play02 .detail_main .main_col .post #bifidus_book p{ text-align: center; color: #ffffff; font-weight: bold; }

#fun.play02 .body .cont p a:after { content:url(/img/fun/icon_link_01.gif); position: relative; top: 2.15px; padding-left: 7px; }
#fun.play02 .body .sheet_img { margin: 15px auto 40px; }
#fun.play02 .body .bnr_img { margin-top: 15px; position: absolute; right: 15%;}
#fun.play02 .body .bnr_img a { display: inline-block; }
#fun.play02 .body .bnr_img a:hover img { opacity:0.7; }
#fun.play02 .detail_main .main_col .post .body .sheet_images .sheet_images_inner { position: relative; min-height: 475px; }
#fun.play02 .detail_main .main_col .post .body .sheet_images { width:auto; margin:15px 0 35px; text-align:center; }
#fun.play02 .body .sheet_images .sheet_img img { margin:20px 0; display: inline-block; }

/* @group cover01 --------------------------- */
#fun.cover01 { }

#fun.cover01 .post .body dl.mov { margin-top:30px; }
#fun.cover01 .post .body dl.mov dt { font-size:16px; font-weight:bold; text-align:center; }
#fun.cover01 .post .body dl.mov dd { width:545px; margin:5px auto 0 auto; }

#fun.cover01 .post .img_none01 { width:615px; margin:5px auto 0 auto; font-size:12px; }


/* @banner list --------------------------- */
.bnr_area {
	margin: 54px 20px;
}
.bnrList {
	display: flex;
	justify-content: space-around;
	width: 100%;
	margin: 0 auto;
}
.bnrList li:hover {
	opacity: 0.8;
}
.bnrList li:not(:last-child) {
	margin-right: 14px;
}
.bnrList li img {
	width: 100%;
}

#fun .toTop.toBb536 a {
	background-image: url(/img/fun/img_toBb536.png);
	background-repeat: no-repeat;
	width: 80px;
	height: 75px;
	background-size: 100%;
	right: 20px;
}

#fun .toTop.toBb536 a:hover {
	background-position: 0 -75px;
}


@media screen and ( max-width:768px ){

#fun .fun_wrap { width:100%; padding:0; background:none; }

#fun #fun_contents { width:100%; }

#fun .topicpath { display:none; }

#fun.learn06 .detail_main .main_col .frame_inner .post  dt.frozen { margin-left:0px; }

/*===================================================================
	contents
===================================================================*/
#fun .detail_head { width:100%; height:auto; margin-top:0; border-radius:0;  }
#fun .detail_head .ttl { padding:12px 10px 8px 10px; font-size:18px; line-height:1.5; }
#fun .detail_head .ttl br { display:none; }

#fun .detail_main { margin-top:0; }


/* @group main_col --------------------------- */
#fun .detail_main .main_col { }
#fun .detail_main .main_col .frame { padding:30px 10px 30px 10px; border-radius:0; }
#fun .detail_main .main_col .frame_inner { padding:0 0 0 0; }

#fun .detail_main .main_col .post h2.ttl { font-size:16px; }

#fun .detail_main .main_col .post .body .ttl { font-size:16px; }
#fun .detail_main .main_col .post .body .answer { font-size:16px; }
#fun .detail_main .main_col .post .body .img img { max-width:100%; height:auto; }

#fun .detail_main .main_col .post .body dl.ingredients { width:auto; padding:0 10px; }
#fun .detail_main .main_col .post .body dl.ingredients dt { padding:0; }
#fun .detail_main .main_col .post .body dl.ingredients dd ul li.left_col,
#fun .detail_main .main_col .post .body dl.ingredients dd ul li.right_col { width:100%; padding-left:0; }
#fun .detail_main .main_col .post .body dl.ingredients .overview { width:100%; }
#fun .detail_main .main_col .post .body dl.ingredients .overview th { width:75%; vertical-align:top; }
#fun .detail_main .main_col .post .body dl.ingredients .overview td { width:25%; vertical-align:top; }

#fun .detail_main .main_col .post .body dl.howto dt { padding:15px 10px 0 10px; }
#fun .detail_main .main_col .post .body dl.howto dd { padding:5px 15px 15px 15px; }

#fun .detail_main .main_col .post .summary { margin-top:30px; }

#fun .detail_main .main_col .pagination { padding:0 10px; }
#fun .detail_main .main_col .pagination ul li { width:50%; }

#fun .detail_main .main_col .share { width:auto; margin-top:30px; padding:0 10px; }
#fun .detail_main .main_col .share ul li.left_col,
#fun .detail_main .main_col .share ul li.right_col { float:none; width:100%; }
#fun .detail_main .main_col .share ul li.right_col { margin-top:20px; }
#fun .detail_main .main_col .share ul li.left_col img,
#fun .detail_main .main_col .share ul li.right_col img { width:100%; height:auto; }


/* @group sub_col --------------------------- */
#fun .detail_main .sub_col { }


/* @group rank --------------------------- */
#fun .detail_main .rank .ttl { padding:0 10px; background-color:#fcdb74; border-radius:0; text-align:center; }
#fun .detail_main .rank .ttl img { max-width:100%; height:auto; }
#fun .detail_main .rank .rank_inner { padding:15px 10px 15px 10px; border-radius:0; background-color:#fff; }

#fun .detail_main .rank .list li .article .txt .icon { margin-bottom:10px; }
#fun .detail_main .rank .list li .article .txt .main { font-size:14px; }
#fun .detail_main .rank .list li .article .txt .main em { display:inline; font-size:14px; font-weight:normal; }


/* @group eat01 --------------------------- */
#fun.eat01 { }


/* @group eat02 --------------------------- */
#fun.eat02 { }


/* @group eat03 --------------------------- */
#fun.eat03 { }

#fun.eat03 .post .body dl.ingredients ul li.auto { width:100%; }
#fun.eat03 .post .body dl.ingredients ul li.auto .overview th { width:75%; }
#fun.eat03 .post .body dl.ingredients ul li.auto .overview td.note { padding-left:1em; }
#fun.eat03 .post .body dl.ingredients ul li.auto .overview td.note p { padding-left:1em; text-indent:-1em; font-size:12px; }

#fun.eat03 .post .body.line01 { padding-bottom:30px; border-bottom:#d2d2d2 solid 2px; }


/* @group goout01 --------------------------- */
#fun.goout01 { }

#fun.goout01 .post .body dl.ingredients dd ul li.right_col { width:auto; }
#fun.goout01 .post .body dl.ingredients dd ul li.right_col .overview.pc tr:last-child { display:none; }
#fun.goout01 .post .body dl.ingredients dd ul li.right_col .overview.sp { display:block; }
#fun.goout01 .post .body dl.ingredients dd ul li.right_col .overview.sp tr th { width:auto; padding-right:0; white-space:normal; }


/* @group goout02 --------------------------- */
#fun.goout02 { }

#fun.goout02 .post .summary dl.info { margin-top:15px; background-color:#eee; border-radius:5px; }
#fun.goout02 .post .summary dl.info dt { padding:15px 10px 0 10px; }
#fun.goout02 .post .summary dl.info dd { padding:5px 15px 15px 15px; }


/* @group learn01 --------------------------- */
#fun.learn01 { }

#fun.learn01 .book.pc { display:none; }

#fun.learn01 .book.sp { display:block; position:relative; margin:30px 2% 0 2%; padding:0.7% 2%; background:url(/img/fun/book_bg_01.gif) center top no-repeat; background-size:100%; }
#fun.learn01 .book.sp .bookIn{ position:relative; width:100%; min-height:0; padding-bottom:72%; overflow:hidden; box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
#fun.learn01 .book.sp .bookIn ul { position:absolute; left:0; top:0; width:100%; overflow:hidden; }
#fun.learn01 .book.sp .bookIn li { position:relative; float:left; width:100%; background-size:100% auto; }
#fun.learn01 .book.sp .bookIn li img { width:100%; height:auto; }
#fun.learn01 .book.sp .bookArrow { position:absolute; bottom:0.5%; width:96%; }
#fun.learn01 .book.sp .bookArrow li { display:inline-block; width:38%; }
#fun.learn01 .book.sp .bookArrow li:first-child { float:left; text-align:right; }
#fun.learn01 .book.sp .bookArrow li:last-child { float:right; text-align:left; }
#fun.learn01 .book.sp .bookArrow li img { width:0.5em !important; margin:0 0.5em; vertical-align:baseline; }
#fun.learn01 .book.sp .num { margin:0 auto; font-weight:bold; color:#2755b4; text-align:center; }
#fun.learn01 .book.sp .num a { color:#2755b4; }
#fun.learn01 .book.sp .num a:hover { text-decoration:none; }
#fun.learn01 .book.sp .num li { display:inline; }
#fun.learn01 .book.sp .num li:first-child:after { margin:0 0.5em; content:"/"; }

#fun.learn01 .char { width:auto; }
#fun.learn01 .char .ttl img { width:100%; height:auto; }
#fun.learn01 .char ul { padding:0; }
#fun.learn01 .char ul li { width:50%; box-sizing:border-box; }
#fun.learn01 .char ul li img { width:100%; height:auto; }


/* @group learn02 --------------------------- */
#fun.learn02 { }

#fun.learn02 .lead01 { margin:0 0 0 0; }

#fun.learn02 .stage { width:100%; margin:30px auto 0 auto; }
#fun.learn02 .stage .mov { position:relative; width:100%; height:auto; margin-top:0; padding:0 0 56.25% 0; background-position:center center; overflow:hidden; background-size:contain; }
#fun.learn02 .stage .mov iframe {  position:absolute; left:0; top:0; width:100% !important; height:100% !important; }

#fun.learn02 .char { width:auto; }
#fun.learn02 .char .ttl img { width:100%; height:auto; }
#fun.learn02 .char ul { padding:0; }
#fun.learn02 .char ul li { width:50%; box-sizing:border-box; }
#fun.learn02 .char ul li img { width:100%; height:auto; }


/* @group learn03 --------------------------- */
#fun.learn03 { }

#fun.learn03 .post .summary { min-height:auto; padding-right:0; padding-bottom:50%; background-position:center bottom; background-size:60% auto; }
#fun.learn03 .post .wp_logo img { width:50%; height:auto; }


/* @group learn04 --------------------------- */
#fun.learn04 { }

#fun.learn04 .post .summary { min-height:auto; padding-right:0; padding-bottom:50%; background-position:center bottom; background-size:60% auto; }
#fun.learn04 .post .wp_logo img { width:50%; height:auto; }


/* @group learn05 --------------------------- */
#fun.learn05 { }

#fun.learn05 .post .body div.point { margin-top:20px; }
#fun.learn05 .post .body div.point ul li { float:none; width:auto; }
#fun.learn05 .post .body div.point ul li:first-child { float:none; width:auto; }

#fun.learn05 .post .body div.point ul li h4.ttl { font-weight:bold; font-size:14px; color:#333; }
#fun.learn05 .post .body div.point ul li h4.ttl + .txt01 { margin-top:5px; }
#fun.learn05 .post .body div.point ul li p:first-child { margin-top:15px; }
#fun.learn05 .post .body div.point ul li p.img img { width:100%; height:auto; }

/* @group learn07 --------------------------- */
#fun.learn07 .post .summary { min-height: auto; padding-right: 0; padding-bottom: 50%; background-position: center bottom; background-size: 60% auto; }
#fun.learn07 .post .wp_logo img { width: 50%; height: auto; }

/* @group learn08 --------------------------- */
#fun.learn08 .post .body img { width: 100%; margin: 0 auto; }
#fun.learn08 .post .body .advisor_box { padding: 15px; }
#fun.learn08 .post .body .advisor_box p { display: block; }
#fun.learn08 .post .body .advisor_box .adv_name span { font-size: 16px; }
#fun.learn08 .post .body .advisor_box .adv_name { width: auto; margin-top: 3%; padding-left: 0; }
#fun.learn08 .post .body .advisor_box .img { width: 50%; margin: 0 auto; }
#fun.learn08 .post .body .question dt { display: block; padding: 0; text-align: center; }
#fun.learn08 .post .body .question dd { width: 100%; }
#fun.learn08 .post .body .question dd .img { margin: 5% auto; }
#fun.learn08 .post .body .point { margin-top: 5%; }
#fun.learn08 .post .body .point dt { padding: 10%; }
#fun.learn08 .post .body .point dt span { }
#fun.learn08 .post .body .point dd { width: 75%; padding-left: 3%; }
#fun.learn08 .post .body .attention { padding: 0 15px; }

#fun.learn08 .post .body .anchor li { display: block; width: 100%; margin: 4% 0; }
#fun.learn08 .post .summary { min-height: auto; padding-right: 0; padding-bottom: 50%; background-position: center bottom; background-size: 60% auto; }
#fun.learn08 .post .wp_logo img { width: 50%; height: auto; }

/* @group learn09 --------------------------- */
#fun.learn09 .post .body .ttl.question { padding-left: 1.8em; text-indent: -1.8em; }
#fun.learn09 .post .body .answer { padding-left: 1.5em; text-indent: -1.5em; }
#fun.learn09 .post .body .item { font-size: 16px; padding-left: 1.5em; text-indent: -1.5em; }
#fun.learn09 .post .body .point dl dt { width: 26%; }
#fun.learn09 .post .body .point dl dd { width: 60%; padding-left: 4%; text-indent: -7%; font-size: 14px; }

/* @group play01 --------------------------- */
#fun.play01 { }

#fun.play01 .lead01 { margin:0 0 0 0; }

#fun.play01 .stage.stage02 { width:100%; margin:30px auto 0 auto; padding:20% 0 0 0; background-position:center top;  background-size:contain; }
#fun.play01 .stage.stage02 .ttl { text-align:center; }
#fun.play01 .stage.stage02 .ttl img { max-width:100%; height:auto; }
#fun.play01 .stage.stage02 .mov { position:relative; width:100%; height:auto; padding:0 0 56.25% 0; background-position:center center; overflow:hidden; background-size:contain; }
#fun.play01 .stage.stage02 .mov iframe {  position:absolute; left:0; top:0; width:100% !important; height:100% !important; }

#fun.play01 .char { width:auto; }
#fun.play01 .char .ttl img { width:100%; height:auto; }
#fun.play01 .char ul { padding:0; }
#fun.play01 .char ul li { width:50%; box-sizing:border-box; }
#fun.play01 .char ul li img { width:100%; height:auto; }


/* @group play02 --------------------------- */
#fun.play02 .detail_main .main_col p br.pc{ display:none; }
#fun.play02 .detail_main .main_col .post .sp #bifi_dance .text,
#fun.play02 .detail_main .main_col .post .sp #bifi_dance .image,
#fun.play02 .detail_main .main_col .post .sp #bifidus_book .text,
#fun.play02 .detail_main .main_col .post .sp #bifidus_book .image{ width: 100%; display: inline-block; vertical-align:top; }
#fun.play02 .detail_main .main_col .post .sp #bifi_dance .link_btn,
#fun.play02 .detail_main .main_col .post .sp #bifidus_book .link_btn{ width: 100%; margin: 15px auto 0px; background-color: #053f8e; border-radius: 5px; }
#fun.play02 .detail_main .main_col .post .sp #bifi_dance .link_btn a,
#fun.play02 .detail_main .main_col .post .sp #bifidus_book .link_btn a{ position: relative; }
#fun.play02 .detail_main .main_col .post .sp #bifi_dance .link_btn a::after,
#fun.play02 .detail_main .main_col .post .sp #bifidus_book .link_btn a::after{ border-right: 4px solid #ffffff; border-top: 4px solid #ffffff; content: ""; height: 10px; position: absolute; right: 18px; top: 50%; transform: translateY(-50%) rotate(45deg); transition: all .5s ease; width: 10px; }
#fun.play02 .detail_main .main_col .post #bifi_dance .text,
#fun.play02 .detail_main .main_col .post #bifi_dance .image,
#fun.play02 .detail_main .main_col .post #bifidus_book .text,
#fun.play02 .detail_main .main_col .post #bifidus_book .image{ width: 100%; display: inline-block; }
#fun.play02 .detail_main .main_col .post #bifi_dance,
#fun.play02 .detail_main .main_col .post #bifidus_book{ padding: 10px; border-radius: 20px; }
#fun.play02 .detail_main .main_col .post #bifi_dance .cont_inner, #fun.play02 .detail_main .main_col .post #bifidus_book .cont_inner{ padding: 10px; }
#fun.play02 .detail_main .main_col .post #bifi_dance .image,
#fun.play02 .detail_main .main_col .post #bifidus_book .image{ margin-top: 20px; }
#fun.play02 .detail_main .main_col .post #bifi_dance .image img,
#fun.play02 .detail_main .main_col .post #bifidus_book .image img{ width: 100%; }
#fun.play02 .detail_main .main_col .post #bifi_dance .link_btn,
#fun.play02 .detail_main .main_col .post #bifidus_book .link_btn{ width: 100%; }
#fun.play02 .body .bnr_img{ display:none; }

/* background */
#fun.play02 .modal .modal-overlay{ opacity: 0; transition:all 0.3s ease; width: 50%; position: absolute; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: -100; transform: scale(1); display: flex; background-color: rgba(0,0,0,0.7); }


/* @group cover01 --------------------------- */
#fun.cover01 { }

#fun.cover01 .post .body dl.mov dt { text-align:left; }
#fun.cover01 .post .img_none01 { width:auto; margin:5px 0 0 0; font-size:12px; }

#fun.cover01 .post .body dl.mov dd,
#fun.cover01 .post .body dl.mov dd img { width:100%; }

	/* @banner list --------------------------- */
	.bnr_area {
		margin: 54px 0 0 0;
		padding: 10px;
	}
	.bnrList {
		flex-direction: column;
	}
	.bnrList li:not(:last-child) {
		margin: 0 0 20px 0;
	}
}

/* END */


/**
 * learn05
 */
#contents {
	background-repeat: repeat-y;
}

#fun .frame_contents {
	margin-top: 50px;
	padding: 25px 70px 60px 35px;
	background: #fff;
	border: 1px solid #ddd;
	border-top: 14px solid #486ec5;
	box-shadow: 0 5px 4px rgba(0, 0, 0, 0.3);
	position: relative;
}

#fun .frame_contents::before {
	position: absolute;
	content: "";
	right: -5px;
	bottom: -15px;
	width: 82px;
	height: 90px;
	background: url(/img/fun/frame_bg_edge.gif) no-repeat;
}

#fun .frame_contents .frame_ttl {
	font-size: 26px;
	font-weight: bold;
	color: #486ec5;
	margin-bottom: 35px;
}

#fun .frame_contents .feature_block {
	display: flex;
	justify-content: space-between;
	margin-bottom: 2.0rem;
}

#fun .frame_contents .feature_block .content {
	width: 650px;
}

#fun .frame_contents .feature_block .thumb {
	flex-shrink: 0;
	width: 152px;
	display: flex;
	align-items: center;
}

#fun .frame_contents .feature_block .thumb.mini img {
	width: 90%;
	margin: 0 auto;
}

#fun .frame_contents .feature_block .thumb img {
	max-width: 100%;
	width: 100%;
	height: auto;
}

#fun .frame_contents .feature_block .feature_ttl {
	display: inline-block;
	font-size: 19px;
	line-height: 1.0;
	color: #486ec5;
	position: relative;
	padding-left: 40px;
}

#fun .frame_contents .feature_block .feature_ttl::before {
	position: absolute;
	left: 0;
	content: "";
	width: 25px;
	height: 58px;
	background: url(/img/fun/icon_feature_ttl.gif);
	background-size: contain;
}

#fun .frame_contents .feature_block .feature_ttl .fukidashi {
	display: inline-block;
	border: 2px solid #486ec5;
	border-radius: 5px;
	position: relative;
	padding: 5px 20px;
	font-weight: bold;
}

#fun .frame_contents .feature_block .feature_ttl .fukidashi::before,
#fun .frame_contents .feature_block .feature_ttl .fukidashi::after {
	content: "";
	position: absolute;
	top: 50%;
}

#fun .frame_contents .feature_block .feature_ttl .fukidashi::before {
	left: -14px;
	margin-top: -7px;
	border: 7px solid transparent;
	border-right: 7px solid #FFF;
	z-index: 2;
}

#fun .frame_contents .feature_block .feature_ttl .fukidashi::after {
	left: -20px;
	margin-top: -10px;
	border: 10px solid transparent;
	border-right: 10px solid #486ec5;
	z-index: 1;
}

#fun .frame_contents .feature_block .feature_desc {
	margin-top: 1.5rem;
}

#fun .about_bb536 {
	margin-top: 70px;
}


@media screen and (max-width: 768px) {
	#contents.fun {
		background: url(/img/common/bg_contents_sp.png) center top repeat-y;
		background-size: 100% auto;
	}
	#fun .frame_contents {
		margin: 34px 10px 0;
		padding: 15px 10px 30px 10px;
		box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	}

	#fun .frame_contents::before {
		right: -5px;
		bottom: -8px;
		width: 30px;
		height: 33px;
		background-image: url(/img/fun/frame_bg_edge_sp.gif);
	}

	#fun .frame_contents .frame_ttl {
		font-size: 18px;
	}

	#fun .frame_contents .feature_block {
		flex-direction: column;
		align-items: center;
		margin-bottom: 2.0rem;
	}

	#fun .frame_contents .feature_block .content {
		width: auto;
		margin-bottom: 1.0rem;
	}

	#fun .frame_contents .feature_block .content .feature_ttl {
		font-size: 16px;
		font-weight: bold;
	}

	#fun .frame_contents .feature_block .thumb {
		width: 40%;
	}
	#fun .frame_contents .feature_block .wt50 {
		width: 50%;
	}
	#fun .frame_contents .feature_block .wt56 {
		width: 56%;
	}

	#fun .toTop.toBb536 a {
		background-image: url(/img/fun/img_toBb536_sp.png);
		width: 53px;
		height: 47px;
		right: 25px;
	}
	#fun .toTop.toBb536 a:hover {
        	background-position: 0 0;
	}
	#fun .about_bb536 {
		margin-top: 0;
	}

}