/*
Theme Name: ryukyoin 
Theme URI:
Author: SIS
Author URI: http://www.ryukyoin.jp/ 
Description:
Version: 0.1
License:
License URI:
Tags:
Text Domain: shinnyo-en

*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Zen+Antique+Soft&display=swap');

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, sup, 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, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
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 {
    line-height: 1.5;
}

a:hover{
    color:#999;
}

#container{
    margin: 0 auto;
    width: 900px;
}

#main {
    position: relative;
}

#main:after {
    height: 0;
    visibility: hidden;
    content: ".";
    display: block;
    clear: both;
}

#conts {
    width: 800px;
    float: left;
}

.content{
    width:800px;
    padding-top:150px;
    background-position: 0px 0px;
    clear:both;
}

.takumi {
    clear: both;
    margin-bottom: 50px;
    overflow: auto;
}

.takumi a {
    background-image: url("images/track_enter.jpg");
    background-repeat: no-repeat;
    cursor: pointer;
    display: block;
    float: left;
    height: 349px;
    margin-right: 7px;
    text-indent: -9999px;
    width: 760px;
}

#takumi_enter {
    background-position: 0 0;
}

#takumi_enter:hover, #takumi_enter.hover {
    background-position: 0 -349px;
}

#header {
    padding: 29px 0px 5px;
    background: url("images/header-bg.gif") no-repeat scroll left bottom transparent;
    margin-bottom: 24px;
}

#header a:hover{
    opacity: 0.4;
    filter: alpha(opacity=40);
}

#navi {
    color: #000;    
    width: 73px;
    position: relative;
    background:#FFFFFF;
    float: right;
}

.btn{
    width:30px;
    height:93px;
    overflow:hidden;
    float:right;
    cursor:pointer;
}

#menu-about{
    background-image: url("images/menu-about.gif");
}
#menu-open{
    background-image: url("images/menu-open.gif");
}
#menu-history{
    background-image: url("images/menu-history.gif");
    margin-top:15px;
}
#menu-track{
    /*background-image: url("images/menu-track.gif");*/
    display: none;
}
.btn:hover, .btn.hover {
    background-position: 0 -93px;
}

.bdr{
    width:30px;
    height:93px;
    padding-right:6px;
    margin-top:15px;
    border-right:#000 dotted 1px;
    font-size: 80%;
    writing-mode: vertical-rl;
    line-height: 2.1;
    text-indent: 8px;
    font-family: 'Zen Antique Soft', sans-serif;
}

#left_box{
    width:350px;
    float:left;
    padding:10px;
    font-size:12px;
}
#right_box{
    width:350px;
    float:left;
    padding:10px;
    font-size:12px;
}
#add{
    width:300px;
    background:#eee;
    padding:10px;
    margin:15px 0px 10px;
}
#news_wrap{
    width:400px;
    font-size:10px;
    float:left;
}
#news_img{
    float:left;
    margin-right:30px;
}
#news_box{
    float:left;
}
#footer a{
    border-bottom: 1px dotted #999;
    text-decoration:none;
    color:#000;
}
#footer a:hover{
    color:#999;
}
#news{
    width:300px;
}
#footer_add{
    width:300px;
    font-size:10px;
    float:left;
    margin-left:20px;
}
#footer{
    background:url(images/footer-line.gif) no-repeat left top;
    width:760px;
    overflow:auto;
    padding-top:30px;
}
#news_main{
    width:900px;
    margin:auto;
    font-size:12px;
}
#close{
    background:url(images/kiyaku-header.gif) no-repeat bottom;
    height:30px;
    text-align:right;
    font-size:10px;
    padding-top:15px;
}
#close a{
    text-decoration:none;
    color:#000;
    padding:5px;
    border:#999 dotted 1px;
}
#close a:hover{
    color:#999;
}
.article{
    border-bottom:1px dotted #999;
    padding:30px 0px;
    overflow:auto;
}
.article a{
    color:#000;
    font-weight:bold;
    text-decoration:none;
    border-bottom:#999 dotted 1px;
}
.news_left{
    width:100px;
    float:left;
    font-size:12px;
    font-weight:bold;
}
.news_right{
    float:left;
}
.article h1{
    padding:0px;
    margin:0px;
    margin-bottom:10px;
    font-size:12px;
    font-weight:bold;
}
#news_title{
    border-bottom:1px dotted #999;
    padding:10px 0px;
    font-weight:bold;
}
#news_footer{
    background:url(images/kiyaku-header.gif) no-repeat top;
    height:100px;
    margin-top:5px;
    padding-top:30px;
}
#news_main a:hover{
    color:#999;
}
#kiyaku_main{
    width:900px;
    margin:auto;
    font-size:10px;
}
#kiyaku_main h1{
    font-size:10px;
    font-weight:bold;
    padding:10px 0px;
}
#kiyaku_main h2{
    font-size:10px;
    font-weight:bold;
    padding:20px 0px 5px 0px;
}
#kiyaku_main a{
    color:#000;
    text-decoration:none;
}
#kiyaku_main a:hover{
    color:#999;
}
#kiyaku_footer{
    background:url(images/footer-line.gif) no-repeat top;
    height:100px;
    margin-top:5px;
    padding-top:30px;
}
.hibikiai,
.others {
    text-align: center;
}
.hibikiai h3,
.others h3 {
    font-size: 120%;
    position: relative;
    display: inline-block;
}
.hibikiai h3::before ,
.others h3::before ,
.hibikiai h3::after ,
.others h3::after {
    display: block;
    content: "";
    position: absolute;
    top: 0.8em;
    width: 2em;
    height: 1px;
    background-color: #000;
}
.hibikiai h3::before ,
.others h3::before {
    left: -2.5em;
}
.hibikiai h3::after ,
.others h3::after {
    right: -2.5em;
}
.hibikiai h3,
.others h3,
ul.movies {
    font-family: 'Zen Antique Soft', sans-serif;
}
ul.movies {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
ul.movies li {
    top: 0;
    margin: 10px 0;
}
ul.movies li:not(:nth-child(3n-2)) {
    margin-left:10px;
}
ul.movies li img ,
ul.movies li iframe {
    display: block;
}
.pager {
    height: 2em;
    margin-bottom: 1em;
}
.pager i {
    display: inline-block;
    line-height: 0;
    height: 0;
    width: 0;
    border: 0.5em solid #ccc;
    border-radius: 0.5em;
    margin: 0 2em;
}
.pager i.selected {
    border-color: #000;
}