/* ------------------------------------------------------
     header
------------------------------------------------------ */
/* Media Queries */
@media screen and (max-width: 640px) {

    body {
        max-width: 100%;
        min-width: 100%;
    }
    #page {
        width: 100%;
    }

.display_pc{
    display: none!important;
}
.display_sp{
    display: inherit!important;
}
.drawer-nav {
    z-index: 200!important;
    opacity: 0.96;
}
    .pure-container {
        overflow: hidden;
    }
    .sq-site-title {
        margin: 0;
        padding-left: 16px;
    }


/* -- pure-drwr --- */
.pure-toggle-label {
    top: 20px;
    background: none!important;
    width: 40px;
    height: 40px;
    color: #fff;
}
.pure-toggle-label .pure-toggle-icon, .pure-toggle-label .pure-toggle-icon:before, .pure-toggle-label .pure-toggle-icon:after {
    background: #333!important;
}
.nav-primary {
    margin: 0;
    padding: 80px 0 0 0;
    border-bottom: 1px solid #eee;
}
.pure-toggle-label:hover .pure-toggle-icon, .pure-toggle-label:hover .pure-toggle-icon:before, .pure-toggle-label:hover .pure-toggle-icon:after {
    background-color: #000;
}
.pure-toggle[data-toggle='left']:checked~.pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon, .pure-toggle[data-toggle='right']:checked~.pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon, .pure-toggle[data-toggle='top']:checked~.pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon {
    background-color: transparent!important;
}
.pure-toggle-label .pure-toggle-icon, .pure-toggle-label .pure-toggle-icon:before, .pure-toggle-label .pure-toggle-icon:after {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 2px;
    width: 30px;
    cursor: pointer;
    background: #fff;
    display: block;
    content: '';
    -webkit-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
}
.pure-toggle[data-toggle='left']:checked~.pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:before, .pure-toggle[data-toggle='right']:checked~.pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:before, .pure-toggle[data-toggle='top']:checked~.pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon:before {
    -ms-transform: translateX(-50%)rotate(45deg);
    transform: translateX(-50%)rotate(45deg);
    -webkit-transform: translateX(-50%)rotate(45deg);
    background-color: #fff!important;
}
.pure-toggle[data-toggle='left']:checked~.pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:after, .pure-toggle[data-toggle='right']:checked~.pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:after, .pure-toggle[data-toggle='top']:checked~.pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon:after {
    -ms-transform: translateX(-50%)translateY(-10px)rotate(-45deg);
    transform: translateX(-50%)translateY(-10px)rotate(-45deg);
    -webkit-transform: translateX(-50%)translateY(-10px)rotate(-45deg);
    top: 10px;
    background-color: #fff!important;
}
/* =Menu
----------------------------------------------- */

.main-navigation {
    font-size: 12px;
    letter-spacing: 0.4em;
    letter-spacing: -0.01em;
    position: relative;
    z-index: 9999;
}
.main-navigation ul {
    margin: 0;
}
.site-header .search-form {
    position: absolute;
    right: 15px;
    top: 0;
}
.site-header .search-field {
    background: url( "images/search-icon.png" ) 5px center no-repeat;
    background-size: 24px 24px;
    border: none;
    cursor: pointer;
    height: 38px;
    margin: 6px 0 4px;
    padding: 0 0 0 34px;
    position: relative;
    width: 1px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .site-header .search-field {
        background-image: url( "images/search-icon@2x.png" );
    }
}
.site-header .search-field:focus {
    background-color: #fff;
    border: 1px solid #ddd;
    cursor: text;
    max-width: 100%;
    outline: 0;
    width: 240px;
}
.site-header .search-submit {
    display: none;
}
.ie8 .site-header .search-form input {
    padding-top: 8px;
}

@media screen and (max-width: 779px) {
    .menu-toggle {
        cursor: pointer;
    }
    .main-navigation {
        font-size: 15px;
        text-align: left;
    }
    .main-navigation ul {
    }
    .main-navigation.toggled ul {
        display: block;
    }
    .main-navigation h1 {
        padding: 12px 15px;
    }
    .main-navigation h1:hover {
        opacity: 0.8;
        transition: opacity .15s ease-in-out;
    }
    .main-navigation h1:before {
        content: '\f419';
        display: inline-block;
        -webkit-font-smoothing: antialiased;
        font: normal 16px/1 Genericons;
        margin-right: 10px;
        vertical-align: middle;
    }
    .main-navigation a {
        color: #333;
        display: block;
        padding: 12px 15px;
    }
    .main-navigation ul ul a {
        padding-left: 30px;
    }
    .main-navigation ul ul ul a {
        padding-left: 45px;
    }
    .main-navigation ul ul ul ul a {
        padding-left: 60px;
    }
}

@media screen and (min-width: 780px) {
    .menu-toggle {
        display: none;
    }
    .main-navigation {
        font-size: 16px;
        line-height: 54px;
    }
    .main-navigation div.menu > ul,
    .main-navigation ul.menu {
        padding: 0;
    }
    .main-navigation li {
        position: relative;
    }
    .main-navigation div.menu > ul > li.page_item_has_children > a,
    .main-navigation ul.menu > li.page_item_has_children > a,
    .main-navigation div.menu > ul > li.menu-item-has-children > a,
    .main-navigation ul.menu > li.menu-item-has-children > a {
        padding-right: 24px;
    }
    .main-navigation div.menu > ul > li.page_item_has_children > a:before,
    .main-navigation ul.menu > li.page_item_has_children > a:before,
    .main-navigation div.menu > ul > li.menu-item-has-children > a:before,
    .main-navigation ul.menu > li.menu-item-has-children > a:before {
        content: '\f431';
        display: inline-block;
        -webkit-font-smoothing: antialiased;
        font: normal 16px/1 Genericons;
        position: absolute;
        right: 3px;
        top: 18px;
    }
    .main-navigation div.menu > ul,
    .main-navigation ul.menu {
        letter-spacing: -.40em;
    }
    .main-navigation div.menu > ul > li,
    .main-navigation ul.menu > li {
        display: inline-block;
        letter-spacing: 0.2em;
    }
    .main-navigation li a {
        display: block;
        padding: 0 18px;
        color: #333;
    }
    .main-navigation ul ul {
        background-color: #333;
        left: -9999px;
        opacity: 0;
        color: #fff;
        position: absolute;
        text-align: left;
        top: auto;
        transition: opacity .15s ease-in-out;
        width: 200px;
        z-index: 99999;
    }
    .main-navigation ul li:hover > ul {
        left: 0;
        opacity: 1;
    }
    .main-navigation ul ul ul {
        top: 0;
    }
    .main-navigation ul ul li:hover > ul {
        left: 100%;
        opacity: 1;
    }
    .main-navigation ul ul li a {
        line-height: 26px;
        padding-bottom: 10px;
        padding-top: 10px;
    }
    .main-navigation  ul ul li.page_item_has_children > a:before,
    .main-navigation  ul ul li.menu-item-has-children > a:before {
        content: ">";
        display: inline-block;
        position: absolute;
        right: 5px;
        top: 8px;
    }
    .site-header .search-field {
        margin: 9px 0 7px;
        transition: width .4s ease, background .4s ease;
    }
}


#headerInner {
    position: relative;
    max-width: 1240px;
    width: 100%;
    height: 80px;
    margin: 0px auto;
}

.logo-top {
    width: 260px;
    height: 60px;
    display: inline-block;
    margin: 10px 0 0 10px;
    padding: 0;
    text-indent: -9999px;
    background: url(../../images/osaka_logo-sp.png) left top no-repeat;
    background-size:auto 60px;

}.logo-top img{
    height: 40px;
    width: auto;
}

    #center-head #in_gnavi {
        display: none!important;
    }

/*--------------------------------------------------------------
## パンクズリスト
--------------------------------------------------------------*/
#bread {
    width: 100%;
    border-bottom: 2px solid #dcdfe0;
    border-top: 2px solid #dcdfe0;
}
.breadcrumbs {
    font-size: 12px;
    vertical-align: middle;
    width: 90%;
    height: auto;
    margin: 10px auto 10px auto;
}
.breadcrumbs .br-home a{
    vertical-align: bottom;
    display:inline-block;
    height: 20px;
    width: auto;
    text-indent: 0;
    line-height: 20px;
    background-image: none;
    background-repeat: no-repeat;
    background-size:auto 20px;
    background-position: 0 0;
}

.breadcrumbs > span{
    vertical-align: middle;
    display:inline;
    padding-right: 10px;
    margin-right: 10px;
    height: auto;
    line-height: 20px;
    background-image: url(../../images/bread_arrow.png);
    background-repeat: no-repeat;
    background-size:auto 20px;
    background-position: center right;
}
.breadcrumbs > span:last-child{
    background-image: none;

}
/*--------------------------------------------------------------
## タイトル表示エリア
--------------------------------------------------------------*/

/* -- INDEX--- */

    .title-area {
        background-image: url(../../images/title_bg_red_dod.png);
        background-size: auto 50%;
        width:  100%;
        padding: 50px 0 40px 0;
        color: #fff;
        text-align: left;
    }.title-area h2 {
        text-align: center;
        font-weight: lighter;
        letter-spacing: 0.1em;
        font-size: 30px;
        margin-bottom: 0.4em;
    }.title-area p {
        text-align: center;
        font-weight: normal;
        font-size: 18px;
        letter-spacing: 0.1em;
    }



.title-area-inner {
    width: 100%;
    margin: 0 auto;
    position: relative;
    text-align: left;
}
    .title-area h2 {
        font-weight: lighter;
        letter-spacing: 0.1em;
        font-size: 30px;
        margin-bottom: 0.4em;
    }.title-area p {
        font-weight: normal;
        font-size: 18px;
        letter-spacing: 0.1em;
}.title-area .sub-clumn {
    position: inherit;
    right:0;
    top: 0;
}.title-area .sub-clumn p a{
    width: 80%;
    letter-spacing: 0;
    display: block;
    margin: 10px auto 0 auto;
    padding: 10px 8% 8px 8%;
    border: 1px solid #fff;
    border-radius: 4px;
    font-size: 12px;
    color: #fff!important;
}.title-area .sub-clumn p a:hover{
    background: #fff;
    color: #333!important;
}
/* -- 講座・イベントページ--- */

.course-three-box .btn {
    font-weight: bold;
    color: #1b4079;
    width: 90%;
    background: #fff;
    margin: 10px auto;
    border: 1px solid #1b4079;
    padding: 10px 20px 8px 20px;
    border-radius: 4px;
    text-decoration: none;
}


/*--------------------------------------------------------------
カテゴリーアーカイブ
--------------------------------------------------------------*/
.post-list .cat_arv-head-title {
    width: 100%;
    padding: 24px 0 20px 60px;
    background: #fff;
    position: relative;
}
.post-list .cat_arv-head-title:after {
    content: '';
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 20px;
    margin-top: -15px;
}
.post-list .cat_arv-head-title h2{
    height: 30px;
    font-size: 14px;
    font-weight: normal;
    line-height: 30px;
}

.arv_title-career-skills:after{
    background: url(../../images/cat-career-skills.png) left top no-repeat;
    background-size: 30px 30px;
}
.arv_title-culture:after{
     background: url(../../images/cat-culture.png)left top no-repeat;
    background-size: 30px 30px;

}
.arv_title-community:after{
    background: url(../../images/cat-community.png)left top no-repeat;
    background-size: 30px 30px;
}
.arv_title-volunteer:after{
     background: url(../../images/cat-volunteer.png) left top no-repeat;
    background-size: 30px 30px;
}
.arv_title-kids-family:after{
     background: url(../../images/cat-kids-family.png) left top no-repeat;
    background-size: 30px 30px;
}
.arv_title-event-other:after{
     background: url(../../images/cat-event-other.png) left top no-repeat;
    background-size: 30px 30px;
}


.no_post-title {
    font-size: 16px;
    margin: 4em 0 4em 0;
    text-align: center;
    font-weight: normal;
}
/*--------------------------------------------------------------
## MAIN CONTENTS
--------------------------------------------------------------*/
    #main {
    width:100%;
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
    }
    #main-contents{
        float: none;
        padding: 0!important;
    }
    .page-title {
        text-align: center;
        margin: 1em 0 1em 0;
        font-weight: normal;
    }
#center-head-small {
    width: 100%;
    padding: 10px 0 10px 0;
    background: url(../../images/center_head_bg.png)top left no-repeat;
    background-size: 100% auto;
}

.entry_evet .entry-header .sch-icon {
    position: inherit;
    margin: 10px 0;
}
.post-list {
    background: #f4f1f0;
    border-radius: 0;
    overflow: hidden;
}
.entry-content {
    padding: 0 ;
    margin: 0!important;
    position: relative;
}
    .post-list .head-title {
    width: 100%;
    text-align: center;
    padding: 24px 0 20px 0;
    background: url(../../images/main-head-bg.png) left top repeat;
    background-size: 150px 150px;
    position: relative;
}
    .post-list .head-title:after {
    content: '';
    width: 0px;
    height: 0px;
    position: absolute;
    top: 0%;
    left: 0px;
    margin-top: 0px;
    background: none;
    background-size: 0px 0px;

}
    .post-list .head-title h2 {
    height: 60px;
    text-indent: -9999px;
    background: url(../../images/ctr-event-icon-sp.png) center center no-repeat;
    background-size: auto 60px;
}
.entry-header .entry-title {
    font-size: 24px!important;
    margin-bottom: 20px!important;
    font-weight: normal;
}
.entry-header .sch-icon {
    position: absolute;
    top: 20px;
    right: 20px;
}
.post-list .head-title .privacypolicy_btn {
    display: block;
    vertical-align: top;
    font-size: 12px;
    line-height: 14px;
    color: rgba(255,255,255,0.9);
    text-decoration: underline;
    padding: 0;
    position:inherit;
    right: 0;
    top: 0;
    margin-top: 10px;
    text-align: center;
}
/*------- checkbox -----------*/
.select-bar{
    width: 100%;
    padding: 0;
    background: #fafafa;
    border-top: 1px solid #fff;
    margin: 0 auto 20px auto;
}.select-title {
    display: none !important;
    font-weight: bold!important;
    margin: 0!important;
    text-align: center!important;
}
.select-bar ul li {
    text-align: center;
    float: left;
    display: inline-block;
    width: 50%;
    border-radius: 0!important;
    font-size: 12px;
    font-weight: bold;
    line-height: 40px;
    padding: 0.6em 0!important;
}.select-bar ul li a {
    color: #fff;
}
.select-bar ul li.checed{
    color: #fff;
    border-radius: 0px!important;
    background: #f6b93b;
    padding: 0.6em 0!important;
    }

.checkbox-icon {
  position: relative;
  vertical-align: middle;
}
.checkbox-icon:before {
  content: "\f3d0";
  font-family: "Ionicons";
  color: #888;
    vertical-align: top;
  font-size: 16px;
  margin-right: 3px;
}
.checkbox-active .checkbox-icon:before{
  content: "\f3d0";
  color: #fff;
}
.select-bar ul li.cheack {
    margin-left: 0!important;
    color: #333;
    font-weight: normal;
    background: #fff;
    padding: 0.6em 0;
}.select-bar ul li.cheack a {
    color: #333;
    }
/*------- checkbox -----------*/

.btn {
    display: block;
    margin: 1em 0;
    background: #eee;
    padding: 1em;
}
#primary {
        width: 100%;
        background: #f7f7f5;
    }
    .primary_gy {
        margin: 0!important;
    }


#post {
    width: 100%;
    margin:0 0 10px 0!important;
    box-sizing: border-box;
    padding: 8px;
    background: #fff;
    min-height:inherit;
    }
    .post-contents-area #post{
    float: none!important;
    }

/*------- POST -----------*/

.slider .new,.arti-h-img .new {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 50px;
    height: auto;
    z-index: 999;
}

/*------- カテゴリーによる帯色 -----------*/

#post.category-volunteer {
    border-top: 4px solid #d68682;
    }
#post.cat-career-skills{
    border-top: 4px solid #6cb4c5;
}
#post.cat-culture{
    border-top: 4px solid #c18ebe;
}
#post.cat-community{
    border-top: 4px solid #dfdf8f;
}
#post.cat-volunteer{
    border-top: 4px solid #d68682;
}
#post.cat-kids-family{
    border-top: 4px solid #f4b2cf;
}
#post.cat-event-other {
    border-top: 4px solid #a2cc7e;
}
    .sp-row:after {
    content: "";
    display: table;
    clear: both;
    }
    .post-entry {
        height: 60px;
        float: left!important;
        width: 20%!important;
    }.post-entry img{
        width: 100%;
        height: auto;
    }
    .post-date {
        height: 60px;
        font-size: 14px!important;
        float: left!important;
        width:  50%!important;
        margin: 0 5%!important;
        background: #eee;
        padding: 0;
    }
    .date_title {
        vertical-align: top;
        height: 60px;
        text-indent: -9999px;
        background-image: url(../../images/entry-date.png);
        background-repeat: no-repeat;
        background-size:auto 60px;
        display: inline-block
    }.date_in {
        display: inline-block;
        font-size: 12px;
        line-height: 14px;
        vertical-align: middle;
        margin: 10px 0 0 10px;
    }


/*------- 右上カテゴリーアイコン -----------*/
    .post-category {
        float: left!important;
        width: 20%!important;
        height: 60px;
    }
    .post-category a {
        height: 60px;
        text-indent: -9999px;
    }
.post-category a.post-career-skills {
    background-size: 60px 60px;
}
.post-contents-area a.post-culture {
    background-size: 60px 60px;
}

.post-contents-area a.post-community {
    background-size: 60px 60px;
}
.post-contents-area a.post-volunteer {
    background-size: 60px 60px;
}

.post-contents-area a.post-kids-family {
    background-size: 60px 60px;
}

.post-contents-area a.post-event-other {
    background-size: 60px 60px;
}
    .left-contents {
        width: 40%!important;
        float: left;
    }
    .content-title {
        width: 58%!important;
        margin-left: 2%;
        float: left;
    }



/* -- CONTENTS --- */


.entry-header-poster {
    padding-bottom: 20px!important;

}

.right-poster {
    width: 80%;
    float: inherit;
    margin: 0 auto;
}.right-poster img{
    width: 100%;
    height: auto;
    margin: 0 0 20px 0;
}
/* -- テーブルスタイル --- */
.entry_evet .tableSet {
    background: #fff;
    width: 100%;
    float: inherit;
    margin: 0 auto;
    border-radius: 4px;
    overflow: hidden;
    }
.scr-table .firstItem {
    font-size: 12px;
    min-width: 6em;
    background: #faf9e8;
}
/* -- タイポグラフィースタイル --- */







/*--------------------------------------------------------------
## フッター　すべてのニュース
--------------------------------------------------------------*/
    .all-news {
        width: 90%;
        margin: 30px auto;
        border: 1px solid #eee;
        border-radius: 4px;
    }
    .all-news .title-news {
        padding: 0;
        position: relative;
        height: auto;
        background: #f7f7f5;
    }
    .all-news .title-news h2{
        line-height: 40px;
        font-size: 14px;
        font-weight: bold;
        color: #333;
        padding: 10px 0 10px 10px;
        text-align: left;
    }.all-news .title-news h2 span{
        font-size: 12px;
        font-weight: lighter;
    }
    .all-news .title-news a {
        font-size: 12px;
        color: #206da5;
        padding-right: 0;
        position: absolute;
        top: 50%;
        right: 10px;
        margin-top: -10px;
        background-image:none;
        background-size: 18px 18px;
        background-position: center right;
        background-repeat: no-repeat;
    }
    .news-list {
        width: 94%;
        margin: 0 auto;
    }
    .all-news ul li {
        color: #333;
        border-bottom: 1px solid #eee;
        font-size: 13px;
        letter-spacing: 0.1em;
        height: auto;
        padding: 20px 0;
        line-height: 18px;
    }.all-news ul li a{
        color: #333;
    }
    .all-news ul li .post-cat {
        background: #eee;
        padding: 6px;
        margin: 0 10px;
        border-radius: 4px;
    }

/*--------------------------------------------------------------
## 総合学習センターとは
--------------------------------------------------------------*/
.ft-center-banner {
        width: 100%;
        margin: 60px auto;
    }
    #about_ct_area {
        background: #f7f7f5;
        padding: 10px 0 20px 0;
    }
    .about_center_bn {
        width: 92%;
        text-align: center;
        padding: 38px 0 20px;

    }
.about_center_bn .inner p {
    color: #ffffff;
    margin-bottom: 14px;
    text-align: center;
    }
.about_center_bn .ttl {
    text-align: center;
        color: #ffffff;
        font-size: 30px;
        line-height: 35px;
        margin-bottom: 15px;
        font-weight: bold;
        display: block;
    }
.about_center_bn .description {
        color: #ffffff;
        font-size: 14px;
        line-height: 2;
        font-weight: bold;
        margin-bottom: 14px;
    }


.btn_bounce a.btn{
    position: relative;
    display: block;
    border-radius: 4px;
    background-color:rgba(255,130,89,0.9);
    width: 180px;
    margin: 0 auto;
    padding: 0.8em 0;
    color: #fff!important;
    }


/*--------------------------------------------------------------
## フッター広告エリア
--------------------------------------------------------------*/
.ads-ft {
    margin: 0 auto;
    border-bottom: 1px solid #eee;
    }.ads-ft ul {
        width: 100%;
        margin: 0 auto 5px auto;
    }
    .ads-ft ul li {
        width: 200px;
        height: 50px;
        list-style-type: none;
        float: inherit;
        text-align: center;
        vertical-align: top;
        padding: 0;
        margin:10px auto;
    }
    .ads-ft ul li:last-child {
        margin:10px auto;
    }.ads-ft ul li:nth-child(4n){
        margin:10px auto;
    }



/*--------------------------------------------------------------
#01 ./
--------------------------------------------------------------*/
/* -- index「イベント・講座」「貸室」「学習センターとは」--- */
.list-box {
        width: 100%;
        margin:  0;
    }

    .list-box .three-box {
        padding: 0;
        text-align: center;
        float: inherit;
        width: 90%;
        box-sizing: border-box;
        height: auto;
        margin:0 5% 20px 5%;
        background: #fff;
        border-radius: 4px;
        overflow: hidden;
        /* box-shadow */
        box-shadow:0px 0px 4px 2px rgba(0,0,0,0.09);
        -moz-box-shadow:0px 0px 4px 2px rgba(0,0,0,0.09);
        -webkit-box-shadow:0px 0px 4px 2px rgba(0,0,0,0.09);
    }.list-box .three-box .box-inner {
        padding: 0;
        margin: 0;
        width: 100%;
        display: block;
        position: relative;
        text-align: left;
    }
    .list-box .three-box .box-inner h2{
        color: #fff;
        letter-spacing: 0.2em;
        font-size: 34px;
    }.list-box .three-box .box-inner h2 span{
        color: #fff;
        font-size: 18px;
        line-height: 40px;
        font-weight: lighter;
        letter-spacing: 0.1em;
    }

    .list-box .three-box:last-child, .three-box-end {
            margin-right: 0!important;
        }



    .more-poster {
        vertical-align: top;
        line-height: 240px;
    }

/* -- 「イベント・講座」--- */

    .tp_course_box .tp_gr_title {
        padding: 30px 0 10px 20px;
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,8bc55c+100&0+0,1+100 */
        background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(199,124,78,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(199,124,78,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(199,124,78,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#c77c4e',GradientType=0 ); /* IE6-9 */
    }
    .tp_course_box .more {
        color: #333;
        display: block;
        width: 90%;
        height: 100px;
        line-height: 100px;
        font-size: 18px;
        letter-spacing: 0.1em;
        margin: 0 auto;
    }.tp_course_box .green_arrw {
        background-image: url(../../images/top_course_arrow_or.png);
        background-size: 24px 24px;
        background-position: center right;
        background-repeat: no-repeat;
    }
/* -- 「貸室」-- */
    .venues-sidebar{
        display: none!important;
    }
    .tp_venues_box .tp_gr_title {
        padding: 30px 0 10px 20px;
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,8bc55c+100&0+0,1+100 */
        background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(139,197,92,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(139,197,92,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(139,197,92,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#8bc55c',GradientType=0 ); /* IE6-9 */
    }
    .tp_venues_box .more {
        color: #333;
        display: block;
        width: 90%;
        height: 100px;
        line-height: 100px;
        font-size: 18px;
        letter-spacing: 0.1em;
        margin: 0 auto;
    }.tp_venues_box .green_arrw {
       background-image: url(../../images/top_course_arrow_gr.png);
        background-size: 24px 24px;
        background-position: center right;
        background-repeat: no-repeat;
    }

/* -- 「学習センターとは？」-- */
    .tp_about_box .tp_gr_title {
        padding: 30px 0 10px 20px;
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,8bc55c+100&0+0,1+100 */
        background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(114,184,201,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(114,184,201,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(114,184,201,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#72b8c9',GradientType=0 ); /* IE6-9 */
    }
    .tp_about_box .more {
        color: #333;
        display: block;
        width: 90%;
        height: 100px;
        line-height: 100px;
        font-size: 18px;
        letter-spacing: 0.1em;
        margin: 0 auto;
    }.tp_about_box .green_arrw {
       background-image: url(../../images/top_course_arrow_bl.png);
        background-size: 24px 24px;
        background-position: center right;
        background-repeat: no-repeat;
    }

/*--------------------------------------------------------------
# CENteR-HEADER
--------------------------------------------------------------*/
    #center-head {
        width: 100%;
        min-width:inherit!important;
        padding: 0;
        background: url(../../images/center_head_bg-sp.png) top left no-repeat;
        background-size: 100% auto;
    }
    .header-sub-Inner {
        width: 100%;
        margin: 0 auto;
    }.center-name {
        float: inherit;
    }
    .center-name .logo {
        margin: 0;
        padding: 0;
        width: 65%!important;
    }
    .center-name .logo a{
        display: block!important;
        margin: 12px 0 10px 20px!important;
        height: 0;
        /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
        padding-top: 17.44%!important;
        text-indent: -9999px!important;
        background: url(../../images/logo-sp.png) 0 0 no-repeat!important;
        background-size: contain!important;
    }
    #center-head #in_gnavi {
        display: none;
        float: right;
        vertical-align: top;
        padding-top: 30px;
    }#center-head #in_gnavi ul li{
        vertical-align: top;
        display: inline-block;
        text-align: left;
        margin-left: 10px;
    }
    #in_gnavi ul li a {
        display: block;
        position: relative;
        font-size: 14px;
        line-height: 1em;
        color: #333;
        padding: 1em 2.8em 0.8em 1.2em;
        background: #fff;
        border-radius: 4px;
        letter-spacing: 0.1em;
        width: 180px;
    }
    #in_gnavi ul li a span {
        display: block;
        font-size: 10px;
    }
    .icon_arrow_bl:after{
        content: "";
        background: url(../../images/arrow_bl.png) top left no-repeat;
        background-size: 16px 16px;
        position: absolute;
        width: 16px;
        height: 16px;
        top: 50%;
        right: 14px;
        margin-top: -8px;
    }




    .slider-event {
        width: 95%;
        padding-bottom: 10px;
        margin: 0 auto;
    }
    .slick-list {
        max-width: 100%;
        margin: 0 auto!important;
    }
    .slider-event ul li{
        margin:0 4px ;
    }

/* -- slick  スライダー --- */
.slick-slider {
    margin: 0!important;

}
    .slick-prev, .slick-next{display: none!important;}

.slider .sch-icon,#post .sch-icon {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 60px;
    height: auto;
    z-index: 999;
}

    .slider figcaption {display: none;}
/* -- newsお知らせ --- */
.ctr_news_title {
    margin: 0 auto 10px auto;
    text-align: center;
}
.center-news-list .news a:before {
    content: '';
    width: 20px;
    height: 20px;
    background-size: 20px 20px;
    margin-top: -8px;
}
.center-news-list .news {
    padding: 0px 4px 4px 60px;
    background: #fff;
    border-radius: 4px;
    margin: 0 10px;
    text-align: left;
    position: relative;
}
.center-news-list .news span {
    font-size: 10px;
}
    .center-news-list .news p a{
        font-size: 12px!important;
        line-height: normal;
        display: block;
    }
/******************************************************************

******************************************************************/
.widgettitle {
    display: none;
}

.top-future {
    width: 100%;
    margin: 0 auto;
    border-bottom: 1px solid #eee;
}
ul.tab {
    width: 100%;
    display: table!important;
    border-top: 1px solid #a6a192;
}

ul.tab li{
    width: 50%;
    display: table-cell;
    font-size: 12px;
    letter-spacing: 0.05em;
}ul.tab li a {display: block;text-align: center; padding: 16px 20px 12px 20px;text-decoration: none; color: #fafafa;background: #a6a192;}
ul.tab li.active a{ color: #333;background: #fff;}
ul.tab li a:hover{color: #333;background: #fff;}
ul.tab li span { display: block; font-size: 10px; letter-spacing: 0.9px; }
ul.tab li.active span {color:#fff }


.tab_area{
  display: none;
  }
.tab_content{
  width: 100%;
  overflow: hidden;
  }



.side-box {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 0 0 0;
    border-radius: 0px;
    background-color: rgba( 255, 255, 255, 0.9 );
    margin: 0 auto 0x auto;
    background-image: none;
}

/* -- サイド＿カテゴリー --- */
    .category-box {
        border-top: 4px solid #f6b93b;
        border-bottom: none;border-right: none;border-left: none;
    }
.category-box .side-title {
    height: 50px;
    border-bottom: 1px solid #eee;
    text-align: left;
    padding: 0 20px;
    background-image: none;
    background-repeat: no-repeat;
    background-position: center left;
    background-size: 60px 60px;
    text-indent: 0;
    background-color: inherit;
    border: none;
}
.side-box h2 {
    padding-top: 10px;
    height: 60px;
    font-weight: lighter;
    font-size: 18px;
    letter-spacing: 0.05em;
    color: #333;
}
.side-box h2 p {
    margin-left: 10px;
    color: #888;
    display: inline-block;
    line-height: 16px;
    font-size: 12px;
}
/* -- アクセスランキング＿注目の講座・イベントー --- */
    #sidebar {
        float: none;
    }
    .rank-box {
        border: none;
    }
    .pickup-box {
        border: none;
    }
.rank-box ul li, .pickup-box ul li {
    color: #333;
    display: block;
    padding: 10px 0 12px 0;
    text-indent: 38px;
    border-bottom: 1px solid #ccc;
}
.rank-box ul li:last-child, .pickup-box ul li:last-child {
    border-bottom:none;
}
.rank-box ul li a, .pickup-box ul li a {
    color: #333;
    display: block;
    font-weight: normal;
    font-size: 13px;
    text-indent: initial;
    padding: 0px 20px 0px 60px;
}
.rank-box ul .number1 a{
    background: url(../../images/number1.png) 10px center no-repeat;
    background-size: 30px 30px;
}
.rank-box ul .number2 a{
    background: url(../../images/number2.png) 10px center no-repeat;
    background-size: 30px 30px;
}
.rank-box ul .number3 a{
    background: url(../../images/number3.png) 10px center no-repeat;
    background-size: 30px 30px;
}
.rank-box ul .number4 a{
    background: url(../../images/number4.png) 10px center no-repeat;
    background-size: 30px 30px;
}
.rank-box ul .number5 a{
    background: url(../../images/number5.png) 10px center no-repeat;
    background-size: 30px 30px;
}

    .side-box h3 {
        font-weight: normal;
        color: #555;
        letter-spacing: 0.1em;
        padding-bottom: 0px!important;
    }
    .side-box span {
        font-size: 10px;
    }.title-icon {
        display: block;
        width: 30px;
        margin: 0 auto;
        height: auto;
        padding: 20px 0;
    }.title-icon img {
        width: 30px;
        height: auto;
    }.tags ul li {
        width: 90%;
        margin: 0 auto;
        clear: both;
        display: block;
        padding: 8px 0;
        border-bottom: 1px solid #eee;
    }.tags ul li a{
        color: #333;
    }
    .link_next {
        color: #333;
        font-weight: bold;
        padding-top: 2px;
        text-align: center;
        height: 45px;
        line-height: 45px;
        margin: 20px auto 10px auto;
        display: block;
        width: 90%;
        border-radius: 4px;
        background-color: #f6cc60;
        background-image: url(images/arrow.svg);
        background-size: 14px 14px;
        background-position: 96% center;
        background-repeat: no-repeat;
    }

    .side-tumb {
        display: inline-block;
        width: 90px;
    }.side-title {
        vertical-align: top;
    }.rank li {
        margin: 4px 0;
    }

.side-article {
        width: 100%;
    }
.side-article li {
    clear: both;
}
    .side-tumb { float: left;}
.side-tumb a {
    vertical-align: top;
    display: inline-block;
    width: 80px;
    overflow: hidden;
}
    .side-tumb a img{
        height: 80px;
        width: auto;
        margin: 0;
        max-width: inherit;

    }.side-title {
    }
    .arti-s-title h2{
        font-size: 12px;
        text-align: left;
        font-weight: normal;
        color: #555;
        letter-spacing: 0.1em;
        padding-bottom: 0;
        border-bottom: none;
    }


.number1,.number2,.number3,.number4,.number5 {
        position: relative;
    }
    .number1 .side-tumb span{
        position: absolute;
        top: 4px;
        left: 4px;
        width: 20px;
        height: 20px;
        background-image: url(images/rank_yll-001.png);
        background-size: 20px 20px;
    }.number2 .side-tumb span{
        position: absolute;
        top: 4px;
        left: 4px;
        width: 20px;
        height: 20px;
        background-image: url(images/rank_yll-002.png);
        background-size: 20px 20px;
    }
    .number3 .side-tumb span{
        position: absolute;
        top: 4px;
        left: 4px;
        width: 20px;
        height: 20px;
        background-image: url(images/rank_yll-003.png);
        background-size: 20px 20px;
    }

.ft-future {
    margin-bottom: 30px;
}
.ft-future .side-box{
    width: 90%;
}
.ft-future .arti-s-title h2 a{
    font-size: 16px;
    line-height: 1.4em;
    font-weight: bold;
    color: #333;
    text-decoration: none;
}


.more-btn {
    display: block;
    width: 100%;
    height: 40px;
    margin: 20px auto 10px auto;
    background: #999;
    text-align: center;
    line-height: 40px;
    color: #fff;
    border-radius: 4px;
    background: rgba(214,63,20,0.6);
}

.reco-article li{
    width: 94%;
    padding-top: 9px;
    padding-bottom: 9px;
    border-bottom: 1px solid #eee;
    margin: 0 auto;
    overflow: hidden;
    box-sizing: border-box;
}

/*--------------------------------------------------------------
##フッター検索バー
--------------------------------------------------------------*/
.search_btn_sp{
    position: absolute;
    top: 20px;
    right: 60px;
    height: 40px;
    width: 40px;
    text-indent: -9999px;
    display: block;
    background: url(../../images/search_sp.png) no-repeat center;
    background-size: 24px 24px;
}

    .page-top {

        width: 40%;
        text-align: right;
        margin: 10px 0 10px 60%;
    }
    .src_botm {
        width: 100%;
        box-sizing: border-box;
    background: url(../../images/main-head-bg.png) left top repeat;
    background-size: 150px 150px;
        padding: 1em 20px!important;
    }
form{
    margin:0 30px 0 0;
}
.light {
    padding: 0;
    margin: 0;
}
#searchform {
    position: relative;
}
.src_botm #searchform .search {
    width: 100%!important;
    border-radius: 4px!important;
    height: 60px!important;
    line-height: 60px!important;
    padding:6px 15px 6px 30px !important;
    margin:0!important;
    background:none!important;
    border:none !important;
    background-color: #fff!important;
    -webkit-appearance:none!important;
}
.src_botm .search:hover, .search:focus{
    outline: none!important;
    background-color: #f1f1f1!important;
    border-left :none !important;
    border-right :none!important;
    border-top:none!important;
    border-bottom :none!important;
    border-radius: 0px!important;
    box-shadow: none!important;
    border-radius: 0px!important;
    text-shadow:none!important;
    -webkit-appearance:none!important;
    -webkit-tap-highlight-color : rgba(0,0,0,0)!important;
}
.rounded {
    border-radius:15px;
}
input[type=text]{
    color:#666;
}
.src-btn-botm {
    font-size: 14px!important;
    height: 50px!important;
    width: 50px!important;
    position:absolute!important;
    right:10px!important;
    top:5px!important;
    border:none!important;
    text-indent: -9999px;
    background: url(../../images/search_sp.png) no-repeat center center!important;
    background-size: 25px 25px!important;
    color:#666!important;
    text-shadow: none!important;
    cursor: pointer;
    border-radius: 0%!important;
}
input[type=button]:hover {
    background:#523232 !important;
}



/*--------------------------------------------------------------
## お知らせ一覧ページ
--------------------------------------------------------------*/
/* -- お知らせ一覧 --- */

    .news-box {
        width: 90%!important;
        margin: 0 auto;
    }

    #news-contents .all-news {
    width: 100%;
    box-sizing: border-box;
    margin: 20px auto 20px auto;
    border: 1px solid #eee;
    border-radius: 4px;
    background: #fff;
    }
    #news-contents .all-news .title-news {
        padding: 0;
        position: relative;
        height: 40px;
        background: #f7f7f5;
    }#news-contents .all-news .news_title{
        background: #eee;
    }
    #news-contents .all-news .news_title h2{
        width: 90%;
        margin: 0 auto;
        line-height: 40px;
        font-size: 14px;
        font-weight: bold;
        color: #333;
        padding: 20px 0 15px 0;
        text-align: left;
    }
    #news-contents .news-list {
        width: 90%;
        background: #fff;
        margin: 0 auto;
    }
    #news-contents .all-news ul li {
        color: #333;
        border-bottom: 1px solid #eee;
        font-size: 12px;
        letter-spacing: 0em;
        height: auto;
        line-height: 1.8em;
    } #news-contents .all-news ul li:last-child {
        border: none;}
    #news-contents .all-news ul li a{
        color: #333;
    }#news-contents .all-news ul li a:hover{
        color: #206da5;
        text-decoration: underline;
    }
    .all-news ul li .post-cat {
        background: #eee;
        font-size: 12px;
        padding: 6px;
        margin: 0 10px;
        border-radius: 4px;
    }
    .news-list-title {
        margin-top: 8px;
        display: block;
    }

.news_nav_active {
    background-color: #fff!important;
}
/*--------------------------------------------------------------
## お知らせ-詳細
--------------------------------------------------------------*/
#news-contents_single {
    box-sizing: border-box;
    width: 90%;
    margin: 20px auto;
    background: #fff;
    border-radius: 4px;
    overflow: hidden;
    padding-bottom: 1em;
}
    #news-contents_single .page-title span {
        font-size: 10px;
        color: #777;
    }
#news-contents_single .page-title {
    text-align: left;
    color: #fff;
    font-weight: normal;
    font-size: 16px!important;
    line-height: normal!important;
    letter-spacing: 0;
    padding: .4em 1em .5em .5em;
    margin: 0;
}




    .fb-page {
        border-bottom: 1px solid #eee;
        text-align: center;
        width: 100%;
        padding: 10px 0;
        background: #fafafa;
    }
/*--------------------------------------------------------------
## フッター
--------------------------------------------------------------*/
.footer {
    padding-top: 40px;
    margin: 0 auto;
    background: #fafafa;
    background-image: url(../../images/footer_bo-dod.png);
    background-size: auto 5px;
    background-repeat: repeat-x;
    }
    .footer .ft-top {
        width: 100%;
        position: relative;
    }
    .footer .ft-top .logo-top {
        margin: 0 0 0 20px;
    }
    .footer .ft-top .ft-logo {
        float: inherit;
        text-align: left;
        margin: 0 auto 5px auto;
    }
    .footer .ft-top .ft-menu {
        float: inherit;
        width: 90%;
        height: auto;
        margin: 10px auto 20px auto;
        line-height: 30px;
        list-style-type: none;
        text-align: left;
        vertical-align: top;
        padding: 0;
    }.footer .ft-top .ft-menu ul li{
        color: #333;
        text-align: left;
        font-size: 14px;
        margin: 0;
        width: 48%;
        display: inline-block;
    }.footer .ft-top .ft-menu ul li a{}

    .ft-copy {
        padding: 24px 20px 10px 20px;
        background: #f7f7f5;
        text-align: left;
        font-size: 10px;
    }


/*ページネーション*/

.in-page-nav {
    text-align: center;
    margin: 0px auto;
    padding: 20px 0;
    clear: both;
    border-top: 1px solid #eee;
}
#nav-below {
    width: 95%;
    margin: 0 auto;
}
.nav-previous {
    width: 38%;
    float: left;
    min-height: 1px;
}.nav-next {
    width: 38%;
    float: right;
    min-height: 1px;
}
.nav-previous a, .nav-next a{
    color: #666;
    border: 1px solid #BFBFBF;
    background: #fff;
    border-radius: 4px;
    font-size: 13px;
    font-weight: normal;
    display:inline-block;
    text-decoration: none;
    margin:0 6px;
    padding: 6px 24px;
}.nav-next a{

}
.wp-pagenavi a:hover {
    background-color: #f1f9fa;
    color: #83c3cb;
}.pg-center {
    width: 20%;
    float: left;
    font-size: 13px;
    font-weight: normal;
    display:inline-block;
    text-decoration: none;
    padding: 6px 0;
    margin: 2px 6px ;
}
.wp-pagenavi span{
    color: #999;
    font-weight: normal;
    background: #fafaf7;
    border: 1px solid #eee;}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
    border-color:#eee;
}
.wp-pagenavi span.current {
  font-weight: normal;
}

}
/* -- max-width: 640px --- */