@charset "UTF-8";
/* Custom */
#index_container2 { background: url(../common/data_img/index_1.png) left 8% center no-repeat; }
#img_container { background: url(../common/data_img/index_1.png) left 8% center no-repeat; }
h1 span { padding:0 .4em .2em; border-bottom: 3px double #a7b9a1; }
h2 { margin: 80px 1% 60px; }
h2 span { display: inline-block; position: relative; }
h2 span:before { content: ''; background-color: #b8c8d7; width: 300px; height: 4px; position: absolute; bottom: -15px; left: 50%; display: inline-block; transform: translateX(-50%); }
#colu_list h2 { margin: 0 1% 60px; }
#footer #foot_logo { float: left; }
#clum3 { margin: 35px 0 0; }
#clum3 ul:nth-child(1) { width: 32%; }
#clum3 ul:nth-child(2) { width: 28%; }
#clum3 ul:nth-child(3) { width: 28%; }

/* PC用 */
@media only screen and (min-width: 1001px) {
#logo { width: 12%; float: right; margin: 8px 0 0 1%; }
.nav ul { width: 84%; float: left; }
}

/* Tablet用 */
@media only screen and (min-width: 916px) and (max-width: 1000px) {
#logo { width: 12%; float: right; margin: 8px 0 0 1%; }
.nav ul { width: 84%; float: left; }
}

/* Tablet2用 */
@media only screen and (min-width: 701px) and (max-width: 915px) {
}

/* Mobile用 */
@media only screen and (min-width: 541px) and (max-width: 700px) {
#index_container2 { background: url(../common/data_img/index_1.png) left 8% center / 50% no-repeat; }
#img_container { background: url(../common/data_img/index_1.png) left 8% center / 50% no-repeat; }
}

/* Mobile2用 */
@media screen and (max-width: 540px) {
#index_container2 { background: url(../common/data_img/index_1.png) left 8% center / 50% no-repeat; }
#img_container { background: url(../common/data_img/index_1.png) left 8% center / 50% no-repeat; }
}

/* column */
#column { width: 100%; overflow: hidden; margin: 0; padding: 30px 0; display: block; }
#column h1 { text-align: center; letter-spacing: 0.2em; margin: 30px 0; padding: 0; }
#column h1 span { border-bottom: 3px double #fff; }
#column #main li { width: 22%; float: left; margin: 0 1.4% 3%; padding: 0; display: block; }
#column #main li #colu_img { height: 200px; }
/* Tablet用 */
@media only screen and (min-width: 916px) and (max-width: 1000px) {}
/* Tablet2用 */
@media only screen and (min-width: 701px) and (max-width: 915px) {
#column #main li { width: 45%; margin: 0 2% 4%; }
}
/* Mobile用 */
@media only screen and (min-width: 541px) and (max-width: 700px) {
#column h1 { letter-spacing: 0; }
#column #main li { width: 45%; margin: 0 2% 4%; }
}
/* Mobile2用 */
@media screen and (max-width: 540px) {
#column h1 { letter-spacing: 0; }
#column #main li { width: 45%; margin: 0 2% 4%; }
}

/* practice */
#practice { width: 100%; overflow: hidden; margin: 0; padding: 30px 0; display: block; }
#practice h1 { text-align: center; letter-spacing: 0.2em; margin: 30px 0; padding: 0; }
#practice h2 { margin: 40px 1% 30px; }
#practice h2 span:before { content: ''; width: 150px; }
#practice #two_culm { background: #fff; }
/* Tablet用 */
@media only screen and (min-width: 916px) and (max-width: 1000px) {}
/* Tablet2用 */
@media only screen and (min-width: 701px) and (max-width: 915px) {}
/* Mobile用 */
@media only screen and (min-width: 541px) and (max-width: 700px) {
#practice h1 { letter-spacing: 0; }
}
/* Mobile2用 */
@media screen and (max-width: 540px) {
#practice h1 { letter-spacing: 0; }
}

/* dialogue */
#dialogue { width: 100%; overflow: hidden; margin: 0; padding: 30px 0; display: block; }
#dialogue h1 { text-align: center; letter-spacing: 0.2em; margin: 30px 0; padding: 0; }
#dialogue h1 span { border-bottom: 3px double #fff; }
#dialogue li { background-color: #f8f8f8; border-radius: 12px; }
#dialogue li #colu_days { font-size: 80%; text-align: center; padding: 0 0 8px; }
/* Tablet用 */
@media only screen and (min-width: 916px) and (max-width: 1000px) {}
/* Tablet2用 */
@media only screen and (min-width: 701px) and (max-width: 915px) {}
/* Mobile用 */
@media only screen and (min-width: 541px) and (max-width: 700px) {
#dialogue h1 { letter-spacing: 0; }
}
/* Mobile2用 */
@media screen and (max-width: 540px) {
#dialogue h1 { letter-spacing: 0; }
}

/* contents */
#contents { width: 100%; overflow: hidden; margin: 0; padding: 30px 0; display: block; }
#contents h1 { text-align: center; letter-spacing: 0.2em; margin: 30px 0; padding: 0; }
#contents h2 { margin: 40px 1% 30px; }
#contents h2 span:before { content: ''; width: 150px; }
#contents #three_culm { background: #fff; }
/* Tablet用 */
@media only screen and (min-width: 916px) and (max-width: 1000px) {}
/* Tablet2用 */
@media only screen and (min-width: 701px) and (max-width: 915px) {}
/* Mobile用 */
@media only screen and (min-width: 541px) and (max-width: 700px) {
#contents h1 { letter-spacing: 0; }
}
/* Mobile2用 */
@media screen and (max-width: 540px) {
#contents h1 { letter-spacing: 0; }
}