@charset "utf-8";

/* ヘッダー
----------------------------------------------------*/
header {
width:1000px;
height: 285px;
margin: 0 auto;  
position: relative; 
padding:0;
}
header h1 {
width: 372px;
height:146px;
font-size: 0; 
line-height: 0;
position:absolute; 
top: 23px; 
left: 21px;
background: url(../img/top_logo.png) no-repeat 0 0;
text-indent:-9999px;
overflow:hidden;
}
header h2 {
width: 478px;
height:33px;
font-size: 0; 
line-height: 0;
position:absolute; 
top: 40px; 
right: 10px;
background: url(../img/top_copy.gif) no-repeat 0 0;
text-indent:-9999px;
overflow:hidden;
}
#header_menu {
width: 500px;
top:0;
right:0;
position:absolute;
background-color:#221815;
}
#header_menu li {
float: left;
list-style:none;
}
#header_menu .menu01{
display: block;
width: 40px;
height: 14px;
margin:0 0 7px 32px;
background: url(../img/header_menu01.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#header_menu .menu01:hover {
background-position: left -14px;
}
#header_menu .menu02{
display: block;
width: 54px;
height: 14px;
margin:0 0 7px 20px;
background: url(../img/header_menu02.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#header_menu .menu02:hover {
background-position: left -14px;
}
#header_menu .menu03{
display: block;
width: 54px;
height: 14px;
margin:0 0 7px 20px;
background: url(../img/header_menu03.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#header_menu .menu03:hover {
background-position: left -14px;
}
#header_menu .menu04{
display: block;
width: 28px;
height: 14px;
margin:0 0 7px 20px;
background: url(../img/header_menu04.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#header_menu .menu04:hover {
background-position: left -14px;
}
#header_menu .menu05{
display: block;
width: 68px;
height: 14px;
margin:0 0 7px 20px;
background: url(../img/header_menu05.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#header_menu .menu05:hover {
background-position: left -14px;
}
#header_menu .menu06{
display: block;
width: 98px;
height: 14px;
margin:0 0 7px 20px;
background: url(../img/header_menu06.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#header_menu .menu06:hover {
background-position: left -14px;
}
#header_btn{
width: 510px;
height: 95px;
top: 90px; 
right: 0;
position:absolute;
text-align:right;
}
#header_btn img{
margin:0 0 0 5px;
}
nav {
width:1000px;
padding:20px 0;
margin-bottom: 15px;
background-color:#D4D1CD;
top: 205px; 
right: 0;
position:absolute;
}
nav ul li {
float: left;
list-style:none;
}
nav .menu01{
display: block;
width: 75px;
height: 16px;
margin:0 0 0 47px;
background: url(../img/menu01.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
nav .menu01:hover {
background-position: left -16px;
}
nav .menu02{
display: block;
width: 120px;
height: 16px;
margin:0 0 0 44px;
background: url(../img/menu02.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
nav .menu02:hover {
background-position: left -16px;
}
nav .menu03{
display: block;
width: 89px;
height: 16px;
margin:0 0 0 44px;
background: url(../img/menu03.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
nav .menu03:hover {
background-position: left -16px;
}
nav .menu04{
display: block;
width: 78px;
height: 16px;
margin:0 0 0 44px;
background: url(../img/menu04.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
nav .menu04:hover {
background-position: left -16px;
}
nav .menu05{
display: block;
width: 96px;
height: 16px;
margin:0 0 0 44px;
background: url(../img/menu05.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
nav .menu05:hover {
background-position: left -16px;
}
nav .menu06{
display: block;
width: 76px;
height: 16px;
margin:0 0 0 44px;
background: url(../img/menu06.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
nav .menu06:hover {
background-position: left -16px;
}
nav .menu07{
display: block;
width: 94px;
height: 16px;
margin:0 0 0 44px;
background: url(../img/menu07.gif) top left no-repeat;
text-indent:-9999px;
overflow:hidden;
}
nav .menu07:hover {
background-position: left -16px;
}

/* スライダー
----------------------------------------------------*/
.desSlideshow{
width:1000px;
margin:0 auto;
background-image: url(../images/loading.gif);
background-position: center center;
background-repeat: no-repeat;
}
.desSlideshow .switchBigPic,.desSlideshow .nav{
display: none;
}

/* コンテンツ
----------------------------------------------------*/

#news {
width:770px;
margin:20px auto;
border:#E8E6E3 5px solid;
padding:20px 20px 30px 200px;
background:#FFF url(../img/top_news.gif) 50px 35px no-repeat;
}
#news li {
list-style:none;
width:740px;
padding:0 5px;
margin:0 0 10px 0;
border-bottom:1px dotted #221815;
line-height:2.4;
}
#dark_bg{
clear:both;
width:100%;
padding:30px 0;
background-color:#E8E6E3;
overflow:hidden;
}
#top_use01 {
width:1000px;
margin:0 auto;
padding:0 0 14px 0;
border-bottom:1px solid #D4D1CD;
overflow:hidden;
}
#top_use01 p{
width:210px;
margin:0 auto;
}
#top_use01 .title01{
width:685px;
height:49px;
margin:0 0 20px 0;
background:url(../img/top_use01_title.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#top_use01 .use_top{
width:215px;
margin:0 0 0 20px;
padding:0 0 0 180px;
background:url(../img/top_use01_illust.gif) left 20px no-repeat;
float:left;
font-size:12px;
}
#top_use01 .use_next{
width:215px;
margin:0 0 0 20px;
padding:0 0 0 50px;
background:url(../img/top_use_+.gif) left 53px no-repeat;
float:left;
font-size:12px;
}
#top_use02 {
clear:both;
width:1000px;
margin:0 auto;
padding:18px 0 14px 0;
border-top:1px solid #F0EFEC;
}
#top_use02 p{
width:210px;
margin:0 auto;
}
#top_use02 .title01{
width:685px;
height:49px;
margin:0 0 20px 0;
background:url(../img/top_use02_title.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#top_use02 .use_top{
width:215px;
margin:0 0 0 20px;
padding:0 0 0 180px;
background:url(../img/top_use02_illust.gif) left 20px no-repeat;
float:left;
font-size:12px;
}
#top_use02 .use_next{
width:215px;
margin:0 0 0 20px;
padding:0 0 0 50px;
background:url(../img/top_use_+.gif) left 53px no-repeat;
float:left;
font-size:12px;
}
#top_course {
width:1030px;
margin:0 auto;
padding:30px 0 14px 0;
overflow:hidden;
}
#top_course .title{
width:148px;
height:25px;
margin:0 0 20px 0;
background:url(../img/top_reg_title.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#top_course .box{
width:208px;
height:190px;
margin:0 0 10px 9px;
padding:15px 15px;
border:#E8E6E3 solid 5px;
background-color:#FFFFFF;
float:left;
position:relative;
font-size:12px;
}
#top_course .box .btn{
width:197px;
height:34px;
top:170px;
left:20px;
position:absolute;
}
#top_course .box .course_title{
width:208px;
height:28px;
margin:0 auto 20px auto;
padding:0 auto;
text-align:center;
}
#top_option {
width:1030px;
margin:0 auto;
padding:0 0 14px 0;
overflow:hidden;
}
#top_option .title{
width:169px;
height:25px;
margin:0 0 20px 0;
background:url(../img/top_option_title.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
}
#top_option img{
	margin:0 0 0 4px;
}


/* お問い合わせの窓
----------------------------------------------------*/
address{
width:960px;
margin:15px auto 40px auto;
padding:50px 20px 20px 20px;
background:#F5F4F2 url(../img/top_contactus_bg.gif) left top no-repeat;
overflow:hidden;
}
address .contactus_title{
width:210px;
height:87px;
margin:0 auto;
background:url(../img/top_contactus_title.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
float:left;
}
address .contactus_tel{
width:226px;
height:87px;
margin:0 0 0 30px;
background:url(../img/top_contactus01.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
float:left;
}
address .contactus_fax{
width:226px;
height:87px;
margin:0 0 0 20px;
background:url(../img/top_contactus02.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
float:left;
}
address .contactus_mail{
width:226px;
height:87px;
margin:0 0 0 20px;
background:url(../img/top_contactus03.gif) left top no-repeat;
text-indent:-9999px;
overflow:hidden;
float:left;
}




/*2020.4.15追記*/
body,
html{
	box-sizing: border-box;
}
#top_course {
    max-width: 1030px;
	width: 100%;
    margin: 0 auto;
    padding: 30px 0 14px 0;
    overflow: hidden;
	box-sizing: border-box;
}


#top_course .box {
	box-sizing: border-box;
    width: 31.33333%;
    height:auto;
    margin: 0 1% 20px;
    padding: 15px 15px;
    border: 
#E8E6E3 solid 5px;
background-color:
    #FFFFFF;
    float: left;
    position: relative;
    font-size: 12px;
}
#top_course .box .btn {

    width: 197px;
    height: 34px;
    top: 0;
    left: 0;
    position: relative;
	margin: 20px auto 0;

}

header h2 {
    width: 478px;
    height: 33px;
    font-size: 14px;
    line-height:1.3;
    position: absolute;
    top: 40px;
    right: 10px;
    background:none;
    text-indent:inherit;
    overflow: hidden;
    color: #594D3F;
}

#top_use02 .title01 {
    width: 700px;
    height: 49px;
    margin: 0 0 20px 0;
    background: url(../img/top_use03_title.gif) left top no-repeat;
    text-indent: -9999px;
    overflow: hidden;
}