﻿/* Reset */
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,soup,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,.header,hgroup,menu,nav,output,ruby,.section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:14px;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,#header,.header,hgroup,menu,nav,.section,.row{display:block}body{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}
body {font-family: 'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif; background-color:transparent/*#00a0e2*/; width:100%; text-align:center}
a {text-decoration:none}
/*a:hover img{opacity:0.8;filter:alpha(opacity=80);-ms-filter:"alpha( opacity=80 )";}*/
a:focus { outline:none;}
button:focus { border:none; outline:none !important;}
img{margin:0 auto;max-width:100%; height:auto; /*display:block*/}
p, dt,dd,tr,td,li { line-height:1.6em; letter-spacing:1px;color:#333333;}
p{color:#333333;margin-bottom:2%; text-align:left}
iframe {  border: none;  outline: none;}
#container h1{font-size: 20px; line-height: 1.4em; margin-bottom: 0.6em;font-weight: bold;}
#container .lead h1{font-weight:normal; font-size:16px; color:#000; text-align:left}
.left{float:left; }
.right{float:right;}
.bold{font-weight:bold}
.br{display:inline-block}
.brpc{display:block}
br.br_sp,br.br_pd{display:none}
span.br_pc{display:block;}
.margin_top{padding-top:1em}
/* header */
#header{background-color:#fff; }
#header .inner{position:relative;margin: 0 auto;}
#header .logo_main{/*width:100%;*/width:80%;min-width:200px}
.head_sns_counter{width:100%; display:inline; margin-bottom:10px;}
#header .inner{padding-top:2px}
#header .head_sns{display:inline-block;width:auto; margin-right:2%}
.icn_fb{width:30px; float:left; margin-right:10px}
.icn_tw{width:30px; float:left}
#header .counter{position:relative; right: 0; top: 0; width:30%; height:28px; border:solid 1px #cc3333; text-align:center; padding:2px; display:inline-block;color:#cc3333; font-size:10px;}
#header .counter h1{ display:inline-block;margin-bottom:1%}
.counter p{color:#cc3333; font-size:17px; text-align:center;line-height:1.2em}
/* nav */
nav{width:100%; background-color:#cc9900;}
nav ul{ font-size:0; margin:0 auto;}
nav ul li{display:inline-block;}
ul.sch li.menu-item .menu-txt{font-size:16px; padding:0.6em 0}
/* footer floating_bnr */
#footer_bnr{width:100%; background-color: rgba(217, 60, 65, 0.9);  height:60px; position:fixed; bottom:0; color:#fff;z-index:99; }
#footer_bnr a{color:#fff; font-weight:bold; line-height:60px;text-align: center; margin: 0 auto; font-size:20px; display:block }
#footer_bnr .close {float:left; cursor:pointer;color:#fff; text-align:center; width:15px; height:15px; margin-top:3px;line-height:15px}
/* container */
#container{width:100%; overflow:hidden;}
.inner{width:100%; max-width:768px; margin:0 auto}
#container h2{background-image: url(/naniwa/images/title_bar.jpg); color: rgb(255, 255, 255); font-size: 20px; line-height: 1.4em; padding: 0.3em 0.2em 0.2em; margin-bottom: 0.8em; background-repeat: no-repeat;  background-size: cover;}
.start{margin:2% auto}
.rmd{margin-bottom:2%}
#top ul{ font-size:0; margin:0 auto; margin-bottom:3.3%; padding-top:3%}
#top ul li{display:inline-block; margin-right:70px;}
#top ul li:nth-child(3){margin-right:0}
.box{border-right: solid 1px #666666; border-left: solid 1px #666666; border-bottom: solid 1px #666666; background-color:#fff;overflow:hidden;clear:both}
.box >p{display:inline-block;width:auto;max-width:96%;margin:0 auto; margin-bottom:20px}
.box_inner{width:96%;margin:0 auto; margin-bottom:40px}
#lead,#news,#topics,#policy,#fun,#download,#movie,#information{margin-bottom:3.3%}
/* category color */
.m-category{margin-left:4px;margin-bottom:0.6em}
.m-category>div{font-size:16px;padding: 0.2em 1.2em;height:28px;line-height:28px;margin-right:4px; margin-bottom:4px;vertical-align:middle; letter-spacing:0; box-shadow: 1px 1px 1px rgba(0,0,0,0.8);}
.m-full{background-color:#ffdd00;display:inline-block;color:#fff;}
.m-family{background-color:#3fa9f5;display:inline-block;color:#fff;line-height: 0.9em !important;}
.m-half{background-color:#77cc44;display:inline-block;color:#fff;}
.m-ten{background-color:#000000;display:inline-block;color:#fff;}
.m-five{background-color:#bd1f25;display:inline-block;color:#fff;}
/* top button */
#top_button {margin-top: 3%;}
#top_button li {display: inline-block; width: 40%; margin-bottom: 1%;}
/* lead */
#lead p{text-align:center;line-height:1.8em}
ul.half li { display: inline-block;  vertical-align: top;  margin: 0 14px; margin-bottom: 2%; }
#lead ul li p{width:320px; text-align:left}
/*news */
table.news {width: 100%;border-collapse: separate; box-sizing: border-box;-webkit-box-sizing: border-box; margin-bottom:2%; display: flex;height:160px; overflow-y:scroll;}
table.news tbody { display: block;}
table.news tr {text-align: left;}
table.news tr td {padding: 0 10px;box-sizing:border-box;}
table.news tr td + td { padding: 4px 10px}
/* movie */
.movie-wrap{width:96%;margin-bottom:2%;max-width: 560px; max-height:315px;margin: 0 auto;position: relative;padding-bottom: 56.25%;height: 0;overflow: hidden;}
.movie-wrap iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
#movie{padding-bottom:2%}
/* sponsor */
ul.sponsors{margin:0 auto;overflow:hidden; margin-bottom:3%}
ul.sponsors li {display:inline-block; margin:10px 20px}
ul.sponsors li img{width:auto;}
/* fun */
#fun ul{overflow:hidden;clear:both;}
#fun ul li {display:inline-block; margin:4px; border:solid 2px #cc3333; color:#cc3333; width:174px }
#fun ul li a {color:#cc3333; display:block;padding:6px 10px; font-weight:bold}
#fun ul li a:hover, #fun ul li.active a{background-color:#cc3333; color:#fff}
/* topics */
#topics h3{font-size:20px; color:#cc3333; border-bottom:dotted 2px #cc3333; padding-bottom:4px; margin-bottom:4px;text-align:left;}
#topics p{text-align:left;}
#topics ul{width:96%; margin:0 auto; overflow:hidden}
#topics ul li{border-bottom:solid 1px #666666; clear:both; overflow:hidden; padding:2% 0}
#topics ul li img{float:left; width:33%;padding-right:2%; padding-bottom:1% }
#topics ul li h3{width:64%; float:right}
#topics ul li:last-child{border:none}
#topics ul.indent{width:100%; margin:0; }
#topics ul.indent li{text-align:left; padding: 0 0 1% 0;text-indent:-1.6em; padding-left:1.6em; border:none;}
#topics ul.indent.paceadv,#topics ul.indent.pacebg{width:62%; }
#topics ul.indent.pacebg{width:62%; }
#topics ul li hr{border:dotted 1px #666; clear:both}
/* archives */
#archives ul{width:98%; margin:0 auto; }
#archives ul li {width:30%; display:inline-block; vertical-align:top}
#archives ul li a{display:block;}
#archives{padding-bottom:3.3%}
/* sp_sponsor */
#sp_sponsor ul{width:98%; margin:0 auto; }
#sp_sponsor ul li {width:30%; display:inline-block; vertical-align:top}
#sp_sponsor ul li a{display:block;}
#sp_sponsor{padding-bottom:3.3%}
/* guest_comment */
#guest_comment ul{width:98%; margin:0 auto; }
#guest_comment ul li {width:30%; display:inline-block; vertical-align:top}
#guest_comment ul li a{display:block;}
#guest_comment{padding-bottom:3.3%}
#guest_comment p{text-align:center;line-height:1.8em}
/* org_tshirt */
#org_tshirt ul{width:98%; margin:0 auto; }
#org_tshirt ul li {width:30%; display:inline-block; vertical-align:top}
#org_tshirt ul li a{display:block;}
#org_tshirt{padding-bottom:3.3%}
#org_tshirt p{text-align:center;line-height:1.8em}
/* information */
#information ul{width:98%; margin:0 auto; }
#information ul li {width:30%; display:inline-block}
/* next_event */
#next_event ul{width:98%; margin:0 auto; }
#next_event ul li {width:30%; display:inline-block}
#next_event{padding-bottom:3.3%}
/* others */
#others ul{width:98%; margin:0 auto; }
#others ul li {width:30%; display:inline-block}
#others{padding-bottom:6%}
/* flow */
#qa h3.linered{background-color:#d93c41;color:#fff;margin:0;font-weight:bold;padding:0.6em}
.prf_pic{float:left;width:16%;display:inline-block; margin-right:3%; vertical-align:top}
.int_q,.int_a{margin-bottom:2% }
.int_q img,.int_a img{width:10%; margin-right:2%; display:inline-block;vertical-align:top}
.int_q p{font-weight:bold}
.int_q p,.int_a p{width:86%; display:inline-block; vertical-align:top; padding-top:2%}
/* qa */
#qa h3{color: #d93c41; font-weight:bold; text-align:left; font-size:18px; margin:4% 0 1% 0}
.que, .ans { background-size:5% auto; line-height:24px; padding-left:60px; padding-top:10px; padding-bottom:20px;text-align:left}
.que {background: url(/naniwa/images/icn_que.png) no-repeat top left }
.ans{background: url(/naniwa/images/icn_ans.png) no-repeat top left;  padding-bottom:30px; border-bottom:1px solid #CCC; margin-bottom:20px}
ul.qa_index {clear:both; width:101.2%; margin-right:-1.2%;overflow:hidden ; padding:2% 0;border-bottom:1px solid #CCC; margin-bottom:2%}
.triangle{width: 0px;height: 0px;border-style: solid;border-width: 8px 0 8px 12px;border-color: transparent transparent transparent #cc3333; float:left; margin-right:4px; margin-top:2px}
ul.qa_index li a {float:left; margin-right:1.2%; display:block; padding:6px 5px; text-decoration:none; color:#cc3333; font-weight:bold; border:solid 2px #cc3333;margin-bottom:6px;}
.totop { width:100%;  text-align:right; margin-bottom: 10px;}
.totop a { text-decoration:none; color:#000;}
/* footer */
#footer{background-color:#eeeeee; clear:both; line-height:1.0em}
#footer .inner{ padding-top:20px}
#ft_tit{background-color:#dbdbdb; color:#00a0e2; text-align:center; box-sizing:border-box;padding:2px 10px;font-weight:bold;line-height:1.6em;letter-spacing:4px;font-size:14px;}
span.ft_br{margin-left:3%;}
#ft_cont{position:relative;background-color:#eeeeee;clear:both}
#ft_cont,#ft_cont a{color:#00a0e2; font-size:12px; letter-spacing:2px}
#ft_cont .links {margin-bottom:20px}
#ft_cont .links li,#ft_cont .links li a{color:#999999; }
#ft_cont .links li{display:inline-block; border:solid 2px #c1c1c1;letter-spacing:1px;margin:0 3px; margin-bottom:10px;vertical-align:bottom;padding:4px 6px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#ft_cont .app .txt{display:inline-block;color:#666;font-weight:bold;border:solid 2px #999; margin-bottom:10px;vertical-align:bottom;padding:4px 10px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#ft_cont ul.ent_app{margin-top:10px;margin-bottom:30px;}
#ft_cont ul.ent_app li{width:160px;display:inline-block;margin:0 5px;margin-bottom:10px;}
#ft_cont .contact {margin:0 auto;margin-bottom:50px;text-align:center;;font-weight:bold;}
#ft_cont .contact a{position:relative}
#ft_cont .contact a:after {
    content: ' ';
    position: absolute;
    right: -14px;
    top: 5px;
    width: 0px;
    height: 0px;
    border-top: 5px solid rgba(0, 0, 0, 0);
    border-bottom: 5px solid rgba(0, 0, 0, 0);
    border-left: 8px solid #00a0e2;
    border-right: 0px solid rgba(0, 0, 0, 0);
}
#ft_logo img{ display: block;margin:0 auto }
#ft_logo .logo_line{height:34px; background-color:#00a0e2;text-align:center}
/* to top */
.pagetop {
    display: none;
    position: fixed;
    bottom: 28px;
    right: 0;
	z-index:999;
}
.pagetop a {
    display: block;
    background-color: #808080;
    text-align: center;
    color: #222;
    font-size: 12px;
    text-decoration: none;
    padding: 5px 10px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}
.pagetop a:hover {
    display: block;
    /*background-color: #b2d1fb;*/
	background-color: #999999;
    text-align: center;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    padding:5px 10px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}
/* fee */
#fee p, #fee h3 { text-align:left; margin:30px auto 10px;color:#000;padding-left:0;}
#fee p a {color:#008080; text-decoration:underline}
.page-header {border-bottom: 3px solid #000000; font-size:38px; line-height:42px;color:#000000; font-weight:bold; margin-bottom:20px; text-align:left}
table.fee{margin-top:10px; width:100%; max-width:600px; }
table.fee tr{border-bottom:none}
table.fee tr td{border: solid 1px #999; font-weight:normal;padding:4px 10px; text-align:left }
table.fee tr th{color:#fff;padding:6px 10px 4px 10px; text-align:left;font-weight:bold; letter-spacing:1px;font-size:18px}
table.fee tr td:nth-child(2){white-space: nowrap;  width:100px;text-align:right; vertical-align:bottom}
table.rd th{background-color:#d93c41; border: solid 1px #d93c41; }
table.rd tr td{border: solid 1px #d93c41;}
table.og th{background-color:#ff9c31; border: solid 1px #ff9c31;}
table.og tr td{border: solid 1px #ff9c31;}
#access p{color:#000; margin-bottom:10px}
#access iframe{border:solid 1px #d93c41}
.btn a {display:block;color:#fff;font-size:18px}
.btn{width:280px; max-width:100%; margin:0 auto;line-height:1.6em;font-weight:bold;color:#fff;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;padding:12px 4px;}
.btn.bl{background-color:#6ccbf4;}
.btn.rd{background-color:#d93c41;}
.btn.wt{background-color:#fff; margin-top:40px}
.btn.wt a{color:#d93c41;}
/* result */
.block#top_30{margin-top:0}
.result .block{padding-top:40px; padding-bottom:50px}
.result h2{color:#996;font-size:26px}
table.tbl_rt{margin:0 auto;margin-top:10px; width:48%; max-width:100%; }
table.tbl_rt tr{border-bottom:none}
table.tbl_rt tr td{font-weight:normal;padding:4px; text-align:left }
table.tbl_rt tr th{color:#fff;padding:6px;background-color:#996; text-align:center;font-weight:bold; letter-spacing:1px;font-size:20px;padding-top:8px;margin-bottom:6px}
table.tbl_rt a{color:#262626; text-decoration:underline; padding:8px 2px;display:inline-block}
#result{margin-bottom:3.3%;}
/* voice */
ul.photo li,ul.msg li{width:31.4%; margin:0.8%;display:inline-block;}
ul.voice{width:30%;display:inline-block; vertical-align:top}
#voice ul.voice:nth-child(2n){ margin:0 3%;}
ul.voice li{background-color:#FFFECA;box-shadow:4px 4px 4px rgba(0,0,0,0.6);margin-bottom:2em; padding:2.4em 0.8em 1em 0.8em; font-size:14px;text-align:left; position:relative}
ul.voice li img.pin{position:absolute; top:0; right:0; left:0; margin:auto;width:22px; height:auto}
/* guest */
.role{display:block;font-size:20px;font-weight:bold; color:#d93c41; margin-bottom:1.4%}
ul.gst {overflow:hidden}
ul.gst li{border-bottom:solid 1px #666666; clear:both; overflow:hidden; padding:1em 0}
ul.gst li:last-child{border:none;padding-bottom:0}
ul.gst li img{width:44%; margin-right:4%;margin-bottom:2%;vertical-align:top; float:left}
ul.gst li h3{font-weight:bold; margin-bottom:2%; text-align:left;font-size: 18px;}
/* pacemaker */
ul.pacemaker{display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;width:100%;}
ul.pacemaker{-webkit-box-pack:start;-moz-box-pack:start;-webkit-flex-pack:start;-moz-flex-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;-moz-justify-content:flex-start;justify-content:flex-start;}
ul.pacemaker li{width:30%; margin:1.6%; }
ul.pacemaker li .name{font-weight:bold; margin:0.4em 0}
ul.pacemaker li p{font-size:12px; margin:0.4em auto}
/* about */
#about h3{color:#d93c41; font-weight:bold; font-size:18px; margin:1.2em 0.6em 0.6em}
@media (min-width:768px){
#overview table tr th,
#overview table tr td {
padding: 20px 20px;
border: 1px solid #fff;
}
#overview table tr th {
width: 120px;
background: #d93c41;
color: #fff;
text-align: center;
}
#overview table tr td {
background: #eee;text-align:left; 
}
#overview table tr:nth-child(odd) td {
background: #f2f2f2;
}
#overview table span {  font-weight: bold;
}
/* fee */
#access p, #access iframe{width:80%; margin:10px auto}
}
@media (max-width:767px){
.inner{width:96%;}
#lead ul li p{width:100%; text-align:center}
/* top button */
#top_button {margin-top: 3%;}
#top_button li {display: block; width: 100%; margin-bottom: 1%;}
/* nav */
nav ul li{width:12.4%;}
/* top */
.start{width:50%}
#top ul li{display:inline-block; margin:2% 1%}
#header .counter{width:70%;}
.counter .txt{color:#cc3333; font-size:6px;}
/* topics */
#topics ul li{padding:4% 0}
#topics ul.indent.paceadv{width:100%; }
/* overview */
#overview table {width: 100%;margin:0 auto;margin-bottom: 10px;  }
#overview table tr th,
#overview table tr td {padding: 10px 3%;border: 1px solid #fff;display: block;}
#overview table tr th {background: #d93c41;color: #fff;text-align: center;}
#overview table tr td {background: #eee;text-align:left}
#overview table tr td:first-child {background: #0192cb;color: #fff;text-align: center;font-size: 12px;}
#overview table tr td span {/*background: #0192cb;*/color: #fff;padding: 5px;margin-right:10px;display: inline-block;}
/* result */
table.tbl_rt{width:100%; max-width:480px; float:none}
table.tbl_rt a {padding:12px 2px}
/* voice */
ul.photo li,ul.msg li{width:46%; margin:1.2%;}
#voice ul.voice:nth-child(2n){margin:0 auto;}
ul.voice{width:98%;margin:0 auto; margin-bottom:1em}
/* fun */
#fun h1 .m-category{margin-top:0.4em}
}
@media (max-width:480px){
.brpc{display:inline}
p, td, .que, .ans, .inner li{font-size:14px}
#overview table tr th,table.tbl_rt tr th{font-size:16px}
#container h2{font-size:18px}
br.br_sp{display:block}
span.br_pc{display:inline;}
#header .counter{width:52%;}
.counter .txt{color:#cc3333; font-size:5px;}
.margin_top{padding-top:4%}
/* nav */
nav ul li{width:20%;}
/*lead */
#lead p{margin-bottom:10px}
/* news */
table.news tr td {padding:10px 6px 10px 14px}
table.news tr td + td {padding:10px 14px 10px 6px}
/* fun */
h2#advanced, h2#beginner, h2#person, h2#repeater{font-size:16px}
#fun ul li {margin:1%;width:46%; min-width:150px }
#fun ul li a {padding:1%}
#topics h3{font-size:16px}
#topics p {clear:both}
#topics ul.indent.pacebg{width:100%; }
/* result */
table.tbl_rt tr td{display:block; text-align:center}
/* voice */
ul.photo li,ul.msg li{width:100%; margin:0 auto; max-width:260px}
/* guest */
ul.gst li img{ width:100%; margin:0 auto; max-width:300px;margin-bottom:4%; float:none; clear:both}
ul.gst li h3{text-align:center}
ul.pacemaker li{width:48%; margin:1%; }
/* qa */
ul.qa_index li a{float:none; margin-bottom:10px;text-align:left}
/* footer */
#ft_tit{letter-spacing:1px;}
#ft_logo img{ width:90%;height:auto;max-width:320px;}
#footer_bnr a{font-size:18px;}
}
@media (max-width:400px){
.counter .txt{color:#cc3333; font-size:4px;}
#fun ul li {font-size:13px;}
table.news {height:200px;}
/* nav */
nav ul li{width:25%;}
}
/* entry shedule */
ul.sch {padding-top: 4%;}
ul.sch li.menu-item {width: 100%;text-align: center;margin: 0 auto;margin-bottom: 4%;
}
ul.sch li.menu-item a{display:block}
ul.sch li {width: 24%;max-width: 400px;margin: 0 0.5%;padding: 1%;background-color: #fff;margin-bottom: 3%;font-size: 14px;border: solid 5px #c49b33;
}
/* tshirs form */
fieldset, img {
    border: 0;
    max-width: 100%;
}