/* CSS Document */
#topImage {
    display: block;
    border-radius: 8px;
    margin-bottom:30px;
    overflow: hidden;
    box-shadow:  0 0 4px rgba( 0, 0, 0, 0.3 );
    background-color: #fff;
}
#topImage img{
    display: block;
    width:100%;
    border-radius: 6px 6px 0 0;
    border-bottom: 1px solid #ccc;
    box-shadow: 0 8px 8px rgba( 0, 0, 0, 0.1 );
}
#topImage div.inner{
    padding:30px 30px;
}
#topImage div.topcopy{
    font-weight: bold;
    font-size:180%;
    text-align: center;
    letter-spacing: 3px;
    margin: 0 0 10px 0;
    padding: 0 0 0px 0;
}
#topImage p.term{
    text-align: center;
    font-size:150%;
    margin:0 0 30px 0;
    padding:0 0 30px 0;
    border-bottom:1px solid #ddd;
    color:#006699;
}
p{
    font-size:110%;
    line-height: 170%;
}

#sn01 { background:url(../img/sn01.jpg) 0 0 no-repeat; }
#sn02 { background:url(../img/sn02.jpg) 0 0 no-repeat; }
#sn03 { background:url(../img/sn03.jpg) 0 0 no-repeat; }
#sn04 { background:url(../img/sn04.jpg) 0 0 no-repeat; }
#sn05 { background:url(../img/sn05.jpg) 0 0 no-repeat; }


#bg_excell_01 { background:url('../img/bg_excell_01.png') no-repeat 50% 50% #e2e2e2; text-align:center; vertical-align:middle; padding:0; }
#bg_excell_01 span { display:block; width:163px; height:41px; }

#Main .rcsection .rc3,
#Main .rcsection .rc1,
#Main .rcsection{
    background: none;
}
#Content{
    overflow: visible;
}
#Content #Main{
    float: none;
    width:auto;
}
#PageTitle{
    text-align: center;
    margin:0 auto 0px auto;
    height: auto;
    padding: 10px 0 25px 0;
    overflow: hidden;
    font-weight: normal;
    font-size:105%;
    color:#666;
}
#PageTitle img{
    width: 320px;
    height:auto;
    margin:0 auto 8px auto;
    display: block;
}
#Main .rcsection{
    background: #fff;
    border-radius: 5px;
    box-shadow:  0 0 4px rgba( 0, 0, 0, 0.3 );
    padding:20px;
}
#Main .sectionTitle{
    background:none;
    line-height: 150%;
    height:auto;
    padding: 6px 12px;
    border-radius: 4px;
    background-color: #666;
    background: rgb(0,183,234);
    color:#fff;
    margin:0 0 35px 0;
}
#Main .rcsection .inner{
    padding: 30px;
}
ul.list-style > li,
ul.list > li{
    list-style-type: disc;
    margin: 4px 0;
}

ul.list-style,
ul.list{
    margin: 2px 0 8px 0;
    padding-left: 30px;
}
h3{
    font-size:130%;
    margin-bottom:10px;
    color:#00b7ea;
    font-weight:bold;
    border-left:5px solid #00b7ea;
    padding-left:12px;
}
div.subSection{
    margin-bottom:30px;
}
div.hasImg{
    text-align: center;
}
div.hasImg img{
    width:98%;
}
#sapoinNavi{
    border-radius: 6px;
    overflow: hidden;
    margin:0 0 20px 0;

    box-shadow:  0 0 4px rgba( 0, 0, 0, 0.3 );
}
#sapoinNavi ul{
    display: table;
    width: 100%;
    table-layout: fixed;
    box-sizing: border-box;
    text-align: center;
}
#sapoinNavi li{
    display: table-cell;
    padding: 0 1px 0 0 ;
    vertical-align: middle;
}
#sapoinNavi li:last-child{
    padding-right:0;
}
#sapoinNavi li a{
    display: block;
    padding: 10px 0;

    text-decoration: none;
    font-size: 110%;
    font-weight: bold;
    text-align: center;
    color: rgb(0,183,234);
    background-color: #fff;
}
#sapoinNavi li a:hover{
    opacity: 0.8;
}
#sapoinNavi li.active a{
    color:#fff;
    background: rgb(0,183,234);
    background: -moz-linear-gradient(top, rgba(0,183,234,1) 0%, rgba(0,158,195,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%);
    background: linear-gradient(to bottom, rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 );
    border-bottom:1px solid rgba( 0, 0, 0, 0.3 );
}
table.grid td.center,
table.grid th.center,
.center{
    text-align: center;
}
table.grid{
    border-top:1px solid #999;
    border-left:1px solid #999;
    border-collapse: collapse;
    width: 100%;
}
table.grid thead th{
    text-align: center;
}
table.grid thead th.day{
    width:30%;
}
table.grid td.time{
    white-space: nowrap;
}
table.grid td.rest{
    text-align: center;
    background: #ddd
}
table.grid th,
table.grid td{
    border-bottom:1px solid #999;
    border-right:1px solid #999;
    padding: 6px 6px;
    vertical-align: top;
    text-align: left;
}
table.grid th{
    background-color: #efefef;
}
.breakTime{
    background-color: #e3ebf0;
}
p{
    margin-bottom: 20px;
    font-size:110%;
}
#sapoinList th.koma{
    width:4em;
    text-align:center;
}
#sapoinList th.adress{
    width:4em;
}
#sapoinList th.name{
    width:15em;
}
#sapoinList th.note{
    width:2em;
}

#program th.date{
    width:6em;
}
#program th.time{
    width:10em;
}

#program th.no{
    width:2em;
}
#program div#commentator table.grid td{
    padding:10px 10px 0 10px;
}
#program div#commentator table.grid th{
    background-color: #fff;
    padding:0px;
}
#program th.thumb{
    border-right:none;
}
#program td span.onamae{
    display:block;
    font-size:160%;

}
#program td span.officeName{
    display:block;
    font-size:120%;
    margin-bottom:1%;
}


#accessInfo div.map{
    text-align:center;
}
#accessInfo div.map img{
    width:80%;
}
p.indent{
    text-indent: 1em;
}
.intro p{
    margin-bottom:0;
}
.intro p:last-child{
    margin-bottom:20px;
}

ul.grid{
    overflow: hidden;
}
ul.grid li{
    float: left;
    display: block;
}
ul.cols_4 li{
    width:23%;
    margin: 1%;
    position: relative;
}
ul.cols_4 li img{
    display: block;
    width:100%;
    opacity: 0.7;
    margin:0 0 10px 0;
}
ul.cols_4 li:hover img{
    opacity: 1
}
ul.cols_4 li div.thumb{
    position: relative;
    background-color: #000
}
ul.cols_4 li div.thumb:before{
    content: '';
    width:50px;
    height:50px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left:50%;
    margin: -25px 0 0 -25px;
    z-index: 100;
    background:url(/sapoin/images/movie.png) no-repeat;
    background-size: contain;
    background-position: 50%;
}
ul.cols_4 li a:hover,
ul.cols_4 li a{
    color:#000;
    display: block;
    text-decoration: none;
}

#mvlist{
    display: flex;
    flex-wrap:wrap;
}
#mvlist li{
    float: none;
    width:25%;
    margin:0;
    padding:1%;
    box-sizing: border-box;
}