@charset "Shift_JIS";

@media screen and (min-width:769px) {
/* ---------- body ---------- */

#contents_waku  {
text-align:left;
font-family:Verdana,Arial,sans-serif;
color:#3F2103;
background: url(../img/main_bg.jpg) no-repeat top center;
}

/* ---------- header ---------- */

div#header {
background-image: url(../img/header_bg01.jpg);
background-repeat: repeat-x;
background-position: center top;
height: 112px;
text-align: center;
}

div#header ul {
position: absolute;
top: 68px;
left: 0px;
list-style-type: none;
}

div#header li {
float: left;
}

div#header .navi {
padding-right: 4px;
}

.headerInner {
width: 950px;
height: 112px;
position: relative;
margin-right: auto;
margin-left: auto;
}

.headerBtn01 {
position: absolute;
top: 10px;
left: 822px;
}

#contents_waku .search {
position: absolute;
top: 35px;
left: 660px;
}


/* ---------- H ---------- */
#contents_waku h1 {
position: absolute;
top: 20px;
left: 0px;
}

#contents_waku h2 {
position: absolute;
top: 35px;
left: 145px;
font-size: 10px;
color: #999;
}

#contents_waku h3 {
color: #FFFFFF;
font-weight: bold;
position: absolute;
top: 267px;
left: 119px;
width: 357px;
height: 60px;
line-height: 130%;
font-size: 90%;
}

/* ---------- contents_waku ---------- */

#contents_waku {
width: 950px;
margin: 0 auto;
background:url(../img/main_bg2.jpg) repeat-y top left;
background-color: #FFFFFF;
}

#main_bg {
padding-bottom: 10px;
position: absolute;
margin: 0 0 0 -115px;
}
#main_bg img {
width:1180px;
height:385px;
}


#planes_box {
position: relative;
}

#planes_box .btn_DL {
position: absolute;
left: 50px;
top: 713px;
}

#contents_shilyousai {
padding-top: 400px;
}

.btn {
height: 45px;
width: 890px;
margin-top: 0;
margin-right: 0;
margin-bottom: 20px;
margin-left: 0px;
padding-right: 30px;
padding-left: 30px;
}

.btn ul {
clear: both;
margin: 0px;
padding: 0px;
width: 890px;
}

.btn li {
float: left;
list-style: none;
}

/* ---------- shilyoukai_box ---------- */

#shilyoukai_box {
width: 950px;
height: 530px;
background:  url(../img/bg_mugcolor.png) no-repeat top left;
margin: 0px 0px 50px 0px;
position: relative;
}

.shilyousai_text {
position: absolute;
left: 425px;
width: 367px;
}

.shilyousai_text_red {
color: #FF0000;
font-size: 80%;
}

.shilyousai_text dl {
margin: 0 0 10px 0;
}

.shilyousai_text dt {
font-weight: bold;
margin: 0 0 5px 0;
}

.shilyousai_text dd {
line-height: 120%;
padding: 0 0 0 20px;
margin: 0 0 15px 0;
font-size: 90%;
}

.shilyousai_img {
position: absolute;
left: 770px;
}

/* ---------- color_box ---------- */

#color_box {
width: 950px;
height: 520px;
margin: 0 0 20px 0;
background:  url(../img/bg_color_ichiran.png) no-repeat top left;
position: relative;
}


.color_text p {
position: absolute;
left: 237px;
width: 556px;
top: 30px;
font-weight: bold;
line-height: 140%;
}

.color_text_red {
color: #FF0000;
font-size: 130%;
font-weight: bold;
}

/* ---------- lecture_box ---------- */

#lecture_box {
width: 950px;
height: 95px;
margin:  0 0 10px 0;
background:  url(../img/bg_lecture.png) no-repeat top left;
position: relative;
}

.lecture_text p {
position: absolute;
left: 237px;
width: 556px;
top: 40px;
font-weight: bold;
line-height: 110%;
}

/* ---------- season_box ---------- */

#season_box {
font-size: 12px;
overflow: hidden;
}

#season_box .season_btn {
height: 53px;
margin: 0 0 15px 20px;
}

#season_box .season_btn ul {
clear: both;
}

#season_box .season_btn li {
float: left;
list-style: none;
}

/* ---------- season_box　共通 ---------- */

#season_box p {
line-height: 135%;
}

#season_box .text_white {
margin: 0 0 10px 0;
color: #FFFFFF;
font-size: 11px;
}

/* ---------- season_box / spring1 ---------- */

#spring1 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/spring01_bg.png) no-repeat top left;
position: relative;
}
#spring1 .movieSP1 {
position: absolute;
left: 168px;
top: 285px;
}
#spring1 .used_colorSP1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#spring1 .howtoSP1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#spring1 .zairilyouSP1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / spring2 ---------- */

#spring2 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/spring02_bg.png) no-repeat top left;
position: relative;
}
#spring2 .movieSP2 {
position: absolute;
left: 112px;
top: 263px;
}
#spring2 .used_colorSP2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#spring2 .howtoSP2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#spring2 .zairilyouSP2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- season_box / summer1 ---------- */

#summer1 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/summer01_bg.png) no-repeat top left;
position: relative;
}
#summer1 .movieSU1 {
position: absolute;
left: 168px;
top: 285px;
}
#summer1 .used_colorSU1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#summer1 .howtoSU1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#summer1 .zairilyouSU1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / summer2 ---------- */

#summer2 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/summer02_bg.png) no-repeat top left;
position: relative;
}
#summer2 .movieSU2 {
position: absolute;
left: 112px;
top: 263px;
}
#summer2 .used_colorSU2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#summer2 .howtoSU2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#summer2 .zairilyouSU2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- season_box / autumn1 ---------- */

#autumn1 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/autumn01_bg.png) no-repeat top left;
position: relative;
}
#autumn1 .movieAU1 {
position: absolute;
left: 168px;
top: 285px;
}
#autumn1 .used_colorAU1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#autumn1 .howtoAU1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#autumn1 .zairilyouAU1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / autumn2 ---------- */

#autumn2 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/autumn02_bg.png) no-repeat top left;
position: relative;
}
#autumn2 .movieAU2 {
position: absolute;
left: 112px;
top: 263px;
}
#autumn2 .used_colorAU2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#autumn2 .howtoAU2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#autumn2 .zairilyouAU2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- season_box / winter1 ---------- */

#winter1 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/winter01_bg.png) no-repeat top left;
position: relative;
}
#winter1 .movieWIN1 {
position: absolute;
left: 168px;
top: 285px;
}
#winter1 .used_colorWIN1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#winter1 .howtoWIN1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#winter1 .zairilyouWIN1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / winter2 ---------- */

#winter2 {
width: 950px;
height: 363px;
margin: 0;
background:url(../img/winter02_bg.png) no-repeat top left;
position: relative;
}
#winter2 .movieWIN2 {
position: absolute;
left: 112px;
top: 263px;
}
#winter2 .used_colorWIN2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#winter2 .howtoWIN2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#winter2 .zairilyouWIN2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- btn_top ---------- */

#btn_top {
text-align: right;
margin: 0 0 20px 0;
}

/* ---------- footer ---------- */

div#footer {
background-color: #fcfbf6;
background-image: url(../img/footer_bg01.gif);
background-repeat: repeat-x;
background-position: left top;
}

div .footerInner {
width: 950px;
margin-right: auto;
margin-left: auto;
text-align: left;
padding-top: 20px;
}

div .footerInner p {
margin-bottom: 10px;
}

div .footerInner ul {
font-size: 10px;
list-style-type: none;
}

div .footerInner li {
padding-bottom: 5px;
padding-left: 10px;
background-image: url(../img/footer_icon01.gif);
background-repeat: no-repeat;
background-position: left 3px;
}

div .footerLink {
float: left;
margin-right: 65px;
margin-bottom: 5px;
}

div .footerLink02 {
float: left;
}

div .footerLink a {
color: #666;
text-decoration: none;
}

div .footerLink02 a {
color: #666;
text-decoration: none;
}

div .footerLink a:hover {
color: #999;
text-decoration: underline;
}

div .footerLink02 a:hover {
color: #999;
text-decoration: underline;
}

div .footernavi {
background-image: url(../img/footernavi_bg01.gif);
height: 60px;
background-repeat: repeat-x;
background-position: left top;
background-color: #FFF;
}

div .footernaviInner {
padding-top: 17px;
margin-right: auto;
margin-left: auto;
width: 650px;
}

div .footernavi ul {
list-style-type: none;
}

div .footernavi li {
font-size: 10px;
color: #FFF;
margin-right: 15px;
background-image: url(../img/icon02.gif);
background-repeat: no-repeat;
padding-left: 1.7em;
display: inline;
margin-left: 15px;
}

div .footernavi li a {
text-decoration: none;
color: #FFF;
}

div .footernavi li a:hover {
text-decoration: underline;
color: #FFF;
}

div#copyright p {
margin-bottom: 30px;
font-size: 10px;
}
.sp {
display:none;
}
}

@media screen and (max-width:768px) {
.pc {
display:none;
}
.inner {
width: 100%;
margin: 2% auto;
clear: both;
}
#contents_waku  {
text-align:left;
font-family:Verdana,Arial,sans-serif;
color:#3F2103;
background: url(../img/main_bg.jpg) no-repeat top center;
background-size: 100%;
}


/* ---------- H ---------- */

#contents_waku h2 {
position: absolute;
top: 35px;
left: 145px;
font-size: 10px;
color: #999;
}

#contents_waku h3 {
color: #6a3906;
font-weight: bold;
width: 96%;
text-align: center;
margin:2% auto;
foont-size:16px;
}

/* ---------- contents_waku ---------- */

#contents_waku {
width: 100%;
margin: 0 auto;
background:url(../img/main_bg2.jpg) repeat-y top left;
background-color: #FFFFFF;
}

#main_bg {
padding-bottom: 10px;
/*position: absolute;*/
margin: 0;
overflow: hidden;
}
#main_bg img {
width:100%;
height:auto;
}


#planes_box {
position: relative;
}

#planes_box .btn_DL {
position: absolute;
left: 50px;
top: 713px;
}

/*#contents_shilyousai {
padding-top: 80%;
}*/

.btn {
width: 96%;
margin:0 auto;
}

.btn ul {
overflow: hidden;
margin: 0px auto;
padding: 0px;
width: 99%;
}

.btn li {
float: left;
list-style: none;
width:33%;
margin:0;
padding:0;
}
.btn li img {
width:100%;
}

/* ---------- shilyoukai_box ---------- */

#shilyoukai_box {
width: 100%;
background:  url(../img/bg_mugcolor.png) no-repeat top left;
position: relative;
padding: 0 0 8%;
}

.shilyousai_text {
width: 90%;
margin: 0 auto;
padding: 430px 0 0 0;
overflow: hidden;
}

.shilyousai_text_red {
color: #FF0000;
font-size: 80%;
}

.shilyousai_text dl {
margin: 0 0 10px 0;
}

.shilyousai_text dt {
font-weight: bold;
margin: 0 0 5px 0;
}

.shilyousai_text dd {
line-height: 120%;
padding: 0 0 0 20px;
margin: 0 0 15px 0;
font-size: 90%;
}

.shilyousai_img {
position: absolute;
left: 770px;
}

/* ---------- color_box ---------- */

#color_box {
width: 96%;
margin: 0 auto 4%;
background:  url(../img/bg_color_ichiran_sp.png) no-repeat 0% 100%;
background-size: 100%;
position: relative;
}

.sp_title01 p {
font-weight: bold;
line-height: 140%;
text-align: center;
width: 96%;
margin: 0 auto;
padding:4% 0 112%;
}
.sp_title01 {
width: 100%;
margin: 0 0 10px 0;
background: url(../img/bg_color_sp.png) no-repeat top left;
background-size: 100%;
position: relative;

}

.color_text_red {
color: #FF0000;
font-size: 130%;
font-weight: bold;
}

/* ---------- lecture_box ---------- */
.sp_title02 p {
font-weight: bold;
line-height: 140%;
text-align: center;
width: 96%;
margin: 0 auto;
padding:4% 0 4%;
}
.sp_title02 {
width: 100%;
margin: 0 0 10px 0;
background: url(../img/bg_lecture.png) no-repeat top left;
background-size: 100%;
position: relative;

}

.lecture_text p {
position: absolute;
left: 237px;
width: 556px;
top: 40px;
font-weight: bold;
line-height: 110%;
}

/* ---------- season_box ---------- */

#season_box {
width:100%;
margin:0 auto;
font-size: 12px;
overflow: hidden;
}
#season_box img {
width:100%;
}


#season_box .season_btn {
}

#season_box .season_btn ul {
overflow: hidden;
width:96%;
margin:0 auto!important;
}

#season_box .season_btn li {
float: left;
list-style: none;
width: 50%;
margin:0;
border: 1px solid #d6d6d6;
box-sizing: border-box;
}

/* ---------- season_box　共通 ---------- */

#season_box p {
line-height: 135%;
}

#season_box .text_white {
margin: 0 0 10px 0;
color: #FFFFFF;
font-size: 11px;
}

/* ---------- season_box / spring1 ---------- */

#spring1 {
width: 100%;
max-height: 1000px;
height:800px;
margin: 0 0 15px 0;
background:url(../img/spring01_bg_sp.png) no-repeat top left;
position: relative;
background-size: 100%;
}
#spring1 .movieSP1 {
position: absolute;
left: 168px;
top: 285px;
}
#spring1 .used_colorSP1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#spring1 .howtoSP1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#spring1 .zairilyouSP1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / spring2 ---------- */

#spring2 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/spring02_bg.png) no-repeat top left;
position: relative;
}
#spring2 .movieSP2 {
position: absolute;
left: 112px;
top: 263px;
}
#spring2 .used_colorSP2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#spring2 .howtoSP2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#spring2 .zairilyouSP2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- season_box / summer1 ---------- */

#summer1 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/summer01_bg.png) no-repeat top left;
position: relative;
}
#summer1 .movieSU1 {
position: absolute;
left: 168px;
top: 285px;
}
#summer1 .used_colorSU1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#summer1 .howtoSU1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#summer1 .zairilyouSU1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / summer2 ---------- */

#summer2 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/summer02_bg.png) no-repeat top left;
position: relative;
}
#summer2 .movieSU2 {
position: absolute;
left: 112px;
top: 263px;
}
#summer2 .used_colorSU2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#summer2 .howtoSU2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#summer2 .zairilyouSU2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- season_box / autumn1 ---------- */

#autumn1 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/autumn01_bg.png) no-repeat top left;
position: relative;
}
#autumn1 .movieAU1 {
position: absolute;
left: 168px;
top: 285px;
}
#autumn1 .used_colorAU1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#autumn1 .howtoAU1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#autumn1 .zairilyouAU1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / autumn2 ---------- */

#autumn2 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/autumn02_bg.png) no-repeat top left;
position: relative;
}
#autumn2 .movieAU2 {
position: absolute;
left: 112px;
top: 263px;
}
#autumn2 .used_colorAU2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#autumn2 .howtoAU2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#autumn2 .zairilyouAU2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- season_box / winter1 ---------- */

#winter1 {
width: 950px;
height: 363px;
margin: 0 0 15px 0;
background:url(../img/winter01_bg.png) no-repeat top left;
position: relative;
}
#winter1 .movieWIN1 {
position: absolute;
left: 168px;
top: 285px;
}
#winter1 .used_colorWIN1 {
position: absolute;
left: 524px;
top: 50px;
width: 398px;
}
#winter1 .howtoWIN1 {
position: absolute;
left: 526px;
top: 145px;
width: 260px;
}
#winter1 .zairilyouWIN1 {
position: absolute;
left: 795px;
top: 145px;
width: 136px;
}

/* ---------- season_box / winter2 ---------- */

#winter2 {
width: 950px;
height: 363px;
margin: 0;
background:url(../img/winter02_bg.png) no-repeat top left;
position: relative;
}
#winter2 .movieWIN2 {
position: absolute;
left: 112px;
top: 263px;
}
#winter2 .used_colorWIN2 {
position: absolute;
left: 474px;
top: 30px;
width: 398px;
}
#winter2 .howtoWIN2 {
position: absolute;
left: 476px;
top: 120px;
width: 260px;
}
#winter2 .zairilyouWIN2 {
position: absolute;
left: 745px;
top: 120px;
width: 136px;
}

/* ---------- btn_top ---------- */

#btn_top {
text-align: right;
margin: 0 0 20px 0;
}

/* ---------- footer ---------- */

div#footer {
background-color: #fcfbf6;
background-image: url(../img/footer_bg01.gif);
background-repeat: repeat-x;
background-position: left top;
}

div .footerInner {
width: 950px;
margin-right: auto;
margin-left: auto;
text-align: left;
padding-top: 20px;
}

div .footerInner p {
margin-bottom: 10px;
}

div .footerInner ul {
font-size: 10px;
list-style-type: none;
}

div .footerInner li {
padding-bottom: 5px;
padding-left: 10px;
background-image: url(../img/footer_icon01.gif);
background-repeat: no-repeat;
background-position: left 3px;
}

div .footerLink {
float: left;
margin-right: 65px;
margin-bottom: 5px;
}

div .footerLink02 {
float: left;
}

div .footerLink a {
color: #666;
text-decoration: none;
}

div .footerLink02 a {
color: #666;
text-decoration: none;
}

div .footerLink a:hover {
color: #999;
text-decoration: underline;
}

div .footerLink02 a:hover {
color: #999;
text-decoration: underline;
}

div .footernavi {
background-image: url(../img/footernavi_bg01.gif);
height: 60px;
background-repeat: repeat-x;
background-position: left top;
background-color: #FFF;
}

div .footernaviInner {
padding-top: 17px;
margin-right: auto;
margin-left: auto;
width: 650px;
}

div .footernavi ul {
list-style-type: none;
}

div .footernavi li {
font-size: 10px;
color: #FFF;
margin-right: 15px;
background-image: url(../img/icon02.gif);
background-repeat: no-repeat;
padding-left: 1.7em;
display: inline;
margin-left: 15px;
}

div .footernavi li a {
text-decoration: none;
color: #FFF;
}

div .footernavi li a:hover {
text-decoration: underline;
color: #FFF;
}

div#copyright p {
margin-bottom: 30px;
font-size: 10px;
}




}