@charset "utf-8";


/*---------------------------------------------------
Header
---------------------------------------------------*/ 
body {
    background: url(../img/index/all_bk.png);
}

#header{
position: relative;
width: 100%;
text-align: left;
}

#headerTop{
position: relative;
width: 960px;
margin: 0 auto 0;
padding: 0 0 15px;
background: #fff;
}

#headerTop_test {
    position: relative;
    width: 960px;
    margin: 0 auto 0;
    text-align: center;
    padding: 10px 0 8px;
}

.headerlogo{
float: left;
margin: 10px 0 0 0;
}

.header_h1 {
    position: absolute; top: 95px; left: 5px; 
    font-size: 10px; 
    font-weight: normal; 
    color: #B4B4B5;
}

.headertel {
    float: left;
    margin-top: 2px;
    margin-left: 17px;
}

.headertell_img {
    position: relative;
    margin: 20px 0 5px 0;
}

.headertell_img:after {
    content: "";
    position: absolute;
    background: url(../img/index/tel_after.gif) no-repeat left top;
    height: 92px;
    width: 112px;
    right: -110px;
    top: 0px;
}

.header_mailtext {
    font-size: 11px;
    text-decoration: none;
    position: relative;
    margin: 0 0 0 95px;
}

.header_mailtext:after {
    content: "";
    position: absolute;
    background: url(../img/index/mail_icon.png) no-repeat left top;
    height: 16px;
    width: 22px;
    left: -25px;
    top: 1px;
}



/*GlobalNavi
---------------------------------------------------*/ 

#headerBottom{
position: relative;
width: 100%;
height: 53px;
margin: 0 auto;
/*box-shadow: 0 2px 2px #666;*/
text-align: center;
box-shadow: 0 2px 2px #CCCCCC;
background: url(../img/common/headerbottom_bg.png) repeat-x left top;
}



#globalNavi{
width: 960px;
margin: 0 auto;
text-align: left;
}

#globalNavi li{
    display: inline-block;
}

#globalNavi li a{
    display: block;
    height: 57px;
text-indent: -9999px;
}









#globalNaviIdea_test a{
width: 192px;
background: url(../img/common/test_global_bg.png) repeat-x left top;
}
#globalNaviIdea_test a{
width: 192px;
background: url(../img/common/test_global_bg.png) repeat-x left top;
}
#globalNaviIdea_test a:hover{
    background: url(../img/common/test_global_bg_ov.png) no-repeat 0px 0px;
}

#globalNaviAbout_test a{
width: 192px;
background: url(../img/common/test_global_bg.png) repeat-x -192px top;
}
#globalNaviAbout_test a:hover{
    background: url(../img/common/test_global_bg_ov.png) no-repeat -192px 0px;
}

#globalNaviPrice_test a{
width: 192px;
background: url(../img/common/test_global_bg.png) repeat-x -384px top;
}


#globalNaviPrice_test a:hover{
    background: url(../img/common/test_global_bg_ov.png) no-repeat -384px 0px;
}

#globalNaviArea_test a{
width: 192px;
background: url(../img/common/test_global_bg.png) repeat-x -576px top;
}
#globalNaviArea_test a:hover{
    background: url(../img/common/test_global_bg_ov.png) no-repeat -576px 0px;
}

#globalNaviFaq_test a{
width: 192px;
background: url(../img/common/test_global_bg.png) repeat-x -768px top;
}
#globalNaviFaq_test a:hover{
    background: url(../img/common/test_global_bg_ov.png) no-repeat -768px 0px;
}








#globalNaviIdea a{
width: 192px;
background: url(../img/common/global_bg.png) repeat-x left top;
}

#globalNaviIdea a:hover{
    background: url(../img/common/global_bg_ov.png) no-repeat 0px 0px;
}

#globalNaviAbout a{
width: 192px;
background: url(../img/common/global_bg.png) repeat-x -192px top;
}
#globalNaviAbout a:hover{
    background: url(../img/common/global_bg_ov.png) no-repeat -192px 0px;
}

#globalNaviPrice a{
width: 192px;
background: url(../img/common/global_bg.png) repeat-x -384px top;
}
#globalNaviPrice a:hover{
    background: url(../img/common/global_bg_ov.png) no-repeat -384px 0px;
}

#globalNaviArea a{
width: 192px;
background: url(../img/common/global_bg.png) repeat-x -576px top;
}
#globalNaviArea a:hover{
    background: url(../img/common/global_bg_ov.png) no-repeat -576px 0px;
}

#globalNaviFaq a{
width: 192px;
background: url(../img/common/global_bg.png) repeat-x -768px top;
}
#globalNaviFaq a:hover{
    background: url(../img/common/global_bg_ov.png) no-repeat -768px 0px;
}

#topicpathTop{
padding: 10px 0 0 0;
margin: 0 auto 5px;
background: #FFF;
background: url(../img/common/icon_home.png) no-repeat left 12px;
text-align: left;
font-size: 12px;
}


/*---------------------------------------------------
Footer
---------------------------------------------------*/ 

footer{
width: 960px;
background: #fff;
margin: 0 auto;
border-top: 1px solid #727171;
padding: 15px 0 0 0;
}

.footer_block {

    width: 928px;
    margin: 0 auto;
}

.fLogo {
    width: 337px;
    float: left;
}
.fNav {
    width: 561px;
    margin: 10px 0 0 20px;
    font-size: 16px;
    float: right;
}

.footer_list li {
    display: inline-block;
    margin: 0 0 0 50px;
}

.footer_list li:first-child {
    margin: 0 0 0 0px;
}

.copy_text {
    color:#9e9d9e;
    text-align: left;
}






/*///////////////////////////////////////////////////
//
//
//    PageStyle
//
//    - 各コンテンツのCSSを設定。
//
//
///////////////////////////////////////////////////*/

/*---------------------------------------------------
//
//    トップページ -　index
//
---------------------------------------------------*/ 

#contents {
    text-align: left;
}

#contents a img:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.tops_bar {
    position: relative;
}

.tops_bars {
    position: absolute;
    top: -6px;
    left: 2px;
}

.bx-pager {
    display: inline-block;
    margin: 0 0 15px;
    padding: 25px 0 0 0;
    position: relative;
}

.bx-pager li {
    display: inline-block;
    margin: 0 0 0 10px;
}

.bx-pager li:first-child {
    display: inline-block;
    margin: 0 0 0 0;
}


.top_left_contents {
    width: 570px;
    float: left;
}

.top_left_contents h2 {
    border-left: 8px solid #d47ca3;
    font-size: 20px;
    color: #000;
    margin: 0 0 10px;
}

.top_left_contents h2 span {
    border-bottom: 1px solid #9fa0a0;
    display: block;
    margin: 0 0 0 6px;
}



.top_koushin {
    border: 1px solid #999999;
    padding: 10px;
    margin: 0 0 15px;
}



.top_koushin ul li a:hover {
    text-decoration: none;
}

.top_koushin ul li {
    margin: 0 0 5px;
    padding: 0 0 0 20px;
    position: relative;
    font-size: 16px;
    color: #727171;
}

.top_koushin ul li:after {
    content: "▶︎";
    position: absolute;
    color: #d47ca3;
    left: 0px;
    top: 0px;
}

.osirase_link {
    position: relative;
}

.osirase_link a {
    color: #e4007f;
    font-size: 16px;
    text-decoration: none;
    padding: 0 0 0 25px;
}

.osirase_link:after {
    content: "";
    position: absolute;
    background: url(../img/index/ya_01.png) no-repeat left top;
    height: 24px;
    width: 23px;
    left: 0;
    top: 0;
}

.ba_list li {
    width: 280px;
    float: left;
    margin: 0 0 10px 0;    
}

.ba_list li:nth-child(2n) {
    width: 275px;
    margin: 0 0 10px 10px;
}

.top_right_contents {
    width: 375px;
    float: right;
    margin: 0 0 0 15px;
}

.top_right_contents h2 {
    border-left: 8px solid #5baed5;
    font-size: 20px;
    color: #000;
    margin: 0 0 10px;
}

.top_right_contents h2 span {
    border-bottom: 1px solid #9fa0a0;
    display: block;
    margin: 0 0 0 6px;
}

.top_koushi {
    border: 1px solid #999999;
    padding: 10px;
    margin: 0 0 10px;
}

.teacher_img {
    width: 165px;
    float: left;
}

.teacher_ribon {
    position: relative;
    z-index: 1;
}

.te_img {
    text-align: right;
}

.te_img img {
    background: #EEE url(../img/teacher/teacher_frame_large.png) no-repeat left top;
    background-color: #ffa58a!important;
    width: 150px;
    height: auto;
    position: relative;
    z-index: 0;
    margin: -40px 0 0;
}

.teacher_ribon {
 -webkit-animation-duration: 4s;
 -webkit-animation-timing-function: ease-in;
 -webkit-animation-iteration-count: infinite;
 -webkit-transform-origin: bottom center;
 -webkit-animation-name: outer05;
}

@-webkit-keyframes outer05 {
 0%{
 -webkit-transform: scale(1, 1);
 }
 48%{
 -webkit-transform: scale(1, 1);
 }
 50%{
 -webkit-transform: scale(1.1, 0.9);
 }
 53%{
 -webkit-transform: scale(0.9, 1.1) translate(0, -5px);
 }
 57.5%{
 -webkit-transform: scale(1, 1) translate(0, -3px);
 }
 59%{
 -webkit-transform: scale(1, 1) translate(0, 0px);
 }
 100% {
 -webkit-transform: scale(1, 1);
 }
}
.areaCityTeacherImage.colorRed img{
background-color: #ffa58a!important;
}
.teacherEntryCategories.colorRed .label{
background-color: #ff7951!important;
}
.areaCityTeacherImage.colorYellow img{
background-color: #fdd476!important;
}
.teacherEntryCategories.colorYellow .label{
background-color: #fdc23c!important;
}
.areaCityTeacherImage.colorGreen img{
background-color: #b1e69c!important;
}
.teacherEntryCategories.colorGreen .label{
background-color: #81ca32!important;
}
.areaCityTeacherImage.colorBlue img{
background-color: #aae5f6!important;
}
.teacherEntryCategories.colorBlue .label{
background-color: #6fd8f6!important;
}

.te_name {
    position: relative;
    z-index: 1;
    margin: -10px 0 0 5px;
    text-align: center;
    padding: 3px 0px;
    box-shadow: 0 2px 2px #CCC;
    background: #FFF;
    font-size: 14px;
    font-weight: bold;
    width: 90%;
}

.te_name:after {
    content: "";
    position: absolute;
    background: url(../img/teacher/teacher_comment_image.png) no-repeat left top;
    background-size: 40px;
    width: 40px;
    height: 24px;
    left: -12px;
    top: -7px;
}

.te_name span {
    font-size: 20px;
}


.teacher_text {
    width: 175px;
    float: right;
}

.teacher_text_01 {
    margin: 0 0 10px;
}

.teacher_text_01 span {
    font-size: 18px;
}

.teacher_text dl {
    margin: 0 0 7px;
    height: 30px;
    overflow: hidden;
    font-size: 12px;
    line-height: 1.4em;
}

.teacher_text dl dt {
    border-radius: 10px;
    background: #f3a088;
    color: #fff;
    text-align: center;
    width: 50px;
    float: left;
}

.teacher_text dl dd {
    width: 120px;
    margin: 0 0 0 5px;
    float: right;
}

.teacher_comment {
    height: 100px;
    line-height: 1.5em;
    text-overflow: hidden;
    margin: 0 0 5px;
}

.teacher_link {
    position: relative;
}

.teacher_link a {
    color: #00a0e9;
    font-size: 16px;
    text-decoration: none;
    padding: 0 0 0 25px;
}

.teacher_link:after {
    content: "";
    position: absolute;
    background: url(../img/index/ya_02.png) no-repeat left top;
    height: 24px;
    width: 23px;
    left: 0;
    top: 1px;
}

.top_thought {
    border: 1px solid #999999;
    position: relative;
    margin: 0 0 15px;
    padding: 10px;
}

.top_thought h2 {
    background: url(../img/index/thought_icon.png) no-repeat;
    font-size: 20px;
    padding: 40px 0 20px 95px;
    color: #e4007f;
    position: relative;
    margin: -22px 0 0;
}

.top_thought p span {
    font-size: 16px;
}

.top_thought p span {
    color: #2ea7e0;
}


.top_area {
    margin: 0 0 15px;
    border: 1px solid #999999;
    background: url(../img/index/map_bk.png) no-repeat 630px -33px;
    padding: 10px;
}

.top_area h2 {
    border-left: 8px solid #f39800;
    font-size: 20px;
    color: #000;
    margin: 0 0 10px;
}

.top_area h2 span {
    border-bottom: 1px solid #9fa0a0;
    display: block;
    margin: 0 0 0 4px;
    width: 800px
}

.top_area li {
    display: inline-block;
    font-size: 13px;
    margin: 0 0 8px 4px;
}

.top_area li:nth-child(4){
    display: inline-block;
    font-size: 13px;
    margin: 0 0 6px 0;
}

.top_area li.ta_title {
    width: 75px;
    margin: 0 0 0 25px;
    font-size: 16px;
    font-weight: bold;
}
.top_area li.ta_link {
    width: 65px;
    margin: 0 0 0 0;
}
.top_area li.ta_tiku {
    width: 70px;
    margin: 0 0 0 0;
}

.tp_a1,.tp_a2,.tp_a3,.tp_a4,.tp_a5,.tp_a6 {
    position: relative;
}

.tp_a1:after {
    content: "";
    position: absolute;
    background: url(../img/index/icon_01.png) no-repeat left top;
    background-size: 20px;
    height: 30px;
    width: 20px;
    left: 0;
    top: 0;
}

.tp_a2:after {
    content: "";
    position: absolute;
    background: url(../img/index/icon_02.png) no-repeat left top;
    background-size: 20px;
    height: 30px;
    width: 20px;
    left: 0;
    top: 0;
}

.tp_a3:after {
    content: "";
    position: absolute;
    background: url(../img/index/icon_03.png) no-repeat left top;
    background-size: 20px;
    height: 30px;
    width: 20px;
    left: 0;
    top: 0;
}

.tp_a4:after {
    content: "";
    position: absolute;
    background: url(../img/index/icon_04.png) no-repeat left top;
    background-size: 20px;
    height: 30px;
    width: 20px;
    left: 0;
    top: 0;
}

.tp_a5:after {
    content: "";
    position: absolute;
    background: url(../img/index/icon_05.png) no-repeat left top;
    background-size: 20px;
    height: 30px;
    width: 20px;
    left: 0;
    top: 0;
}

.tp_a6:after {
    content: "";
    position: absolute;
    background: url(../img/index/icon_06.png) no-repeat left top;
    background-size: 20px;
    height: 30px;
    width: 20px;
    left: 0;
    top: 0;
}