@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Kosugi+Maru');
@import url('https://fonts.googleapis.com/css?family=Acme');
@import url('https://fonts.googleapis.com/css?family=Handlee');
/*@import url('https://fonts.googleapis.com/css?family=EB+Garamond');*/
@import url('https://fonts.googleapis.com/css?family=EB+Garamond|Fredericka+the+Great');
@import url('https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c');

body {
    margin: 0;
    color: #333333;
    /*font-family: 'M PLUS Rounded 1c', sans-serif;*/
}

p, h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
}

img {
    vertical-align: bottom;
}

/* �w�b�_�[ */
header {
    position: relative;
}

.header-container {
    padding: 0px;
    margin-bottom: 30px;
}

.header-trial {
    display: block; 
}

.nav-container {
    position: absolute;
    top: 63px;
    right: 0;
    z-index: 20;
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: center;
}
    
.globalnav {
    margin: 0;
    padding: 0;
    list-style: none;
}
    
.globalnav li a {
    display: block;
    padding: 15px 20px;
    color: #333333;
    text-decoration: none;
    font-size: 14px;
    line-height: 100%;
}
    

/* �T�C�g�� */
.header-site-left-inner h1 a {
    color: #000000;
    text-decoration: none;
}

.header-logo {
    margin: 0;
    width: 210px;
    height: 62px;
    background-image: url(../../common/images/log-logo.svg);
    background-size: 210px 62px;
    background-repeat: no-repeat;
    text-indent: -9999px;
}



.header-trial {
    margin: 0;
    height: 62px;
}

.header-trial img {
    width: 100%;
    height: auto;
}

.header-site-left-inner h1 {
    margin: 0;
    font-size: 30px;
}

.header-site-left-inner img {
    border: none;
}

.header-top {
    margin-bottom: 10px;
}

/* �w�b�_�[�̉E�T�C�g�o�[�i�[�@*/
/* �̌��o�[�i�[ */
.right-banner {
    margin-top: 5px;
    width: 260px;
    height: 70px;
    background-color: #4169E1;
    color: #fff;
    font-weight: bold;
}

.right-banner img {
    float: left;
    max-height: 100%;
}

.right-banner .text {
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: 15px;
    margin-left: 10px;
    
}

/* �p���������X�g */

.bread {
    margin-top: 15px;
    margin-bottom: 20px;
}
.bread ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.bread li a {
    display: inline-block;
    padding: 5px;
    color: #000000;
    font-size: 14px;
    text-decoration: none;
}

.bread li a:hover {
    color: #87CEEB;
}

.bread li {
    float: left;
    width: auto;
}

.bread li:after {
    content: '\003e';
    margin-left: 10px;
    margin-right: 10px;
    color: #888888;
}

.bread li:last-child:after {
    content: "";
}

.bread li:last-child a:hover {
    color: #000000;
}

/*�y�[�W�^�C�g��*/

.page-title-wrapper {
    margin-bottom: 0px;
}

.page-title {
    padding-bottom: 15px;
    border-bottom: solid 1px #dddddd;
}
.page-title .page-title-img {
    float: left;
    margin-right: 0;
}

.page-title-img img {
    width: 80%;
}

.page-title-txt {
    float: left;
    margin-top: 5px;
    margin-left: 0;
}

.page-title-txt h1 {
    font-weight: normal;
}

.page-title-txt .eng-title {
    color: #5882FA;
    font-size: 30px;
    font-family: 'Handlee', cursive;
    margin: 0;
}

.page-title-txt .jpn-title {
    margin-top: 5px;
    font-size: 17px;
}

/* �w�b�_�[�摜 */

.slide img {
    width: 100%;
    height: 100%;
    vertical-align: bottom;
    border: none;
}

/* �X���C�h�V���[�S�̂̃X�^�C�� */
.slide {
    position: relative;
    margin: 0 auto;
    font-size: 0;
}

/* �ʐ^�̔z�u */
.slide > .container {
    position: relative;
    /*overflow: hidden;*/
    margin: 0;
    padding: 0;
    list-style: none;
}

.slide > .container > li {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 2s linear;
}

.slide > .container > li.current {
    position: relative;
    z-index: 1;
    opacity: 1;
}
/* �X���C�h�V���[�̃{�^�� */
.slide a.prev,
.slide a.next {
    position: absolute;
    display: block;
    top: 45%;
    width: 40px;
    height: 40px;
    text-indent: -5000px;
    z-index: 10;
}

.slide a.prev {
    background: url(../images/arrow-left1.png) 50% 50% no-repeat;
    left: 0;
}

.slide a.prev:hover {
    background: url(../images/arrow-left2.png) 50% 50% no-repeat;
}

.slide a.prev:active {
    background: url(../images/arrow-dropdown3.png) 50% 50% no-repeat;
}

.slide a.next {
    background: url(../images/arrow-right1.png) 50% 50% no-repeat;
    right: 0;
}

.slide a.next:hover {
    background: url(../images/arrow-right2.png) 50% 50% no-repeat;
}

.slide a.next:active {
    background: url(../images/arrow-right3.png) 50% 50% no-repeat;
}

/* �X���C�h�̃L���b�`�R�s�[ */

.catch {
    margin: 0;
    padding: 15px;
    background-color: rgba(285,255,255,0.7);
    font-size: 25px;
}

/* �w�b�_�[�摜�̃L���b�`�R�s�[���d�˂� */
.top-slide {
    position: relative;
}
.catch {
    position: absolute;
    bottom: 10%;
    right: 3%;
}

/* �g�b�v�y�[�W �N���X�T�v */
.summary a {
    display: block;
    text-decoration: none;
    color: inherit;
    
}

.summary a:hover {
    opacity: 0.8;
}

.summary h1 {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 10px;
    padding-bottom: 5px;
    font-size: 20px;
    font-weight: bold;
}

.summary p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 12px;
}

.summary img {
    width: 100%;
}

.summary-left {
    color: limegreen;
}

.summary-center {
    color: yellowgreen;
}

.summary-right {
    color: mediumpurple;
}
.guide a:hover {
    opacity: 0.8;
}

.guide img {
        width: 100%;
    }

/* ���m�点 */

.news {
    background-color: #e5f4ff;;
}

.news-list {
    padding: 5px;
    list-style: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    
}

.news-list li {
    padding: 10px 0;
    line-height: 24px;
    font-size: 14px;
    border-top: dotted 1px #b2b2b2;
}

.news-list li:first-child {
    border: none;
}

.news-list li a {
    text-decoration: none;
    color: #111;
}

.news-list li a:hover {
    color: #5882FA;
}

.news-list li span.category {
    display: inline-block;
    vertical-align: top;
    width: 100px;
    margin-right: 10px;
    font-size: 11px;
    text-align: center;
    background-color: #f4f4f4;
    border-radius: 20px;
    -webkit-border-radius: 20px;
}

.news-list li span.date {
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
    font-weight: 700;
    font-size: 15px;
}

.news-list li span.title {
    display: block;
    margin-top: 10px;
}

.banner {
    padding: 0px;
}
.banner ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.banner li {
    overflow: hidden;
    padding: 0px;
    margin-bottom: 0px;
    
}

.banner li:first-child {
    margin-top: 20px;
}

.banner img {
    width: 100%;
    height: auto;
    border: none;
    vertical-align: bottom;
}

.banner .title {
    padding: 5px 10px;
    color: #ffffff;
    font-weight:bold;
}

.bkcolor1 {
    background: #4169e1;
}

.bkcolor2 {
    background: #6b8e23;
}

.bkcolor3 {
    background: #e0ffff; 
}

/* �o�[�i�[�Ƀe�L�X�g���d�˂�ݒ� */
.banner a {
    position: relative;
}

.banner .title {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.banner li a {
    display: block;
    margin-bottom: 10px;
    padding: 0;
    text-decoration: none;
    color: #000000;
    font-size: 14px;
}

.banner a:hover {
    opacity: 0.8;
}

.news-link {
    margin-top: 0px;
    text-align: center;
}

.news-link a {
    display: inline-block;
    margin: 0 auto;
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
    color: #fff;
    background-color: #5882FA;
    padding: 10px 35px;
    border-radius: 5px;
}

/* About ���O�E�A�g���G�͂ǂ�ȂƂ��H */

.daihyo-message-text h1 {
    margin-top: 0;
    font-size: 20px;
    font-weight: bold;
    color: #5882FA;
    text-align: center;
}
.daihyo-message-image {
    margin-bottom: 15px;
}

.daihyo-message-image img {
    width: 100%;
}

/* Contents�̃{�b�N�X�̏㉺*/
.main-contents {
    margin-top: 20px;
}


.point-image-odd img {
    width: 100%;
}

.point-image-even img {
    width: 100%;
}

/* About ���O�E�A�g���G�Ƃ͂���ȂƂ��� ���ʏ��� */

.main-contents h1 {
    text-align: center;
    font-size: 23px;
    font-weight: normal;
/*    color: #5882FA;*/
    margin-top: 10px;
    margin-bottom: 0px;
}

.main-contents h2 {
    font-weight: normal;
    font-size: 20px;
}

.main-contents p {
    line-height: 1.5;
}

.main-contents section {
    padding-top: 20px;
}

.text-right {
    text-align: right;
}

/* About ���O�E�A�g���G�Ƃ͂���ȂƂ��� �M�������[ */
.point-gallery {
    margin-top: 10px;
}

.thumbnails-1,
.thumbnails-2,
.thumbnails-3,
.thumbnails-4 {
    margin: 0;
    padding: 0;
    list-style: none;
}

.thumbnails-1 li,
.thumbnails-2 li,
.thumbnails-3 li, 
.thumbnails-4 li {
    float: left;
    margin: 0 2px 0 0;
    border: 2px solid #ededed;
}

.thumbnails-1 li.selected,
.thumbnails-2 li.selected,
.thumbnails-3 li.selected, 
.thumbnails-4 li.selected {
    border: 2px solid #8ac2d0;
}

.thumbnails-1 li img, 
.thumbnails-2 li img,
.thumbnails-3 li img, 
.thumbnails-4 li img {
    width: 60px;
    height: 40px;
}

.main-image-1 img, .main-image-2 img,
.main-image-3 img, .main-image-4 img {
    height: 210px;
}

.log-history {
    margin-top: 30px;
    margin-bottom: 20px;
}

/* �R�s�[���C�g */
.copyright h1 {
    text-align: center;
    font-size: 17px;
    margin-bottom: 5px;
    font-weight: normal
}
.copyright p {
    text-align: left;
    margin: 0;
    color: #666666;
    font-size: 14px;
    line-height: 1.5
}

/* 2019�N8���̋����\�� */
.main-contents .jpn-single-title {
    margin-bottom: 10px;
    font-size: 20px;
    color: royalblue;
    font-weight: bold;
    text-align: left;
}

.timetable-box1 {
    
}

.timetable-box1 .atten {
    border: solid 1px black;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 10px 20px 10px;
    margin-bottom: 30px;
}

.timetable-box1 img,
.timetable-box2 img {
    width: 100%;
}

.timetable-box2 {
    
}

.timetable-box2 h1 {
    font-size: 20px;
    margin-top: 0px;
    margin-bottom: 10px;
}

.timetable-box3 .note {
    font-size: 30px;
    color: red;
}

.note-sp {
    display: none;
}

.note-sp {
    color: red;
    font-size: 20px;
    font-weight: bold;
}

.main-contents p big {
    font-size: 15px;
    font-weight: bold;
}

.main-contents .font-green {
    color: green;
}

/* 8�������̃^�C���e�[�u�� */

/*
#aug-schedule-table tr th {
    background-color: white;
}
*/

/*
#aug-schedule-table tr:nth-child(1),
#aug-schedule-table tr:nth-child(2),
#aug-schedule-table tr:nth-child(3),
#aug-schedule-table tr:nth-child(5),
#aug-schedule-table tr:nth-child(7),
#aug-schedule-table tr:nth-child(8),
#aug-schedule-table tr:nth-child(9){
    background-color: yellow;
}
*/

/*
#aug-schedule-table tr:nth-child(4),
#aug-schedule-table tr:nth-child(6),
#aug-schedule-table tr:nth-child(n+10){
    background-color: powderblue;
}

*/

/*
.atten-points ul {
    list-style: none;
    padding: 0;
    margin: 40px 0 10px 0;
}

.atten-points ul li {
    padding-bottom: 10px;
}

.atten-points big {
    font-weight: normal;
}

.display-switch {
    display: none;
}
*/

/* �t�b�^�[���o�[�̌`�ɂ��� */
.footer {
    margin-top: 40px;
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: lavender;
}

/* �{�b�N�X�̍��E�@*/
.header-contents, .news, .news-wrapper, .footer, 
.top-classlist, .page-title-wrapper, .daihyo-message, 
.main-contents, .main-side-wrapper, .summer-main-contents,
.ttt-main-contents {
    padding-left: 15px;
    padding-right: 15px;
}

/* �{�b�N�X�̏㉺ */
.header-contents {
    padding-top: 20px;
    padding-bottom: 40px;
}

/* �̌��o�[�i�[ */
.header-site-right {
    margin-top: 15px;
}

.header-site-right img {
    width: 75%;
}

.news {
    padding-top: 20px;
    padding-bottom: 20px;
}

.news-list-1 {
    
}

.top-classlist {
    padding-top: 30px;
}

.top-classlist-1, .top-classlist-2, .top-classlist-3 {
    padding-bottom: 20px;
}

.top-classlist-banner {
    margin-top: 20px;
    margin-bottom: 20px;
}

/* �{�b�N�X�̏㉺�@�R���e���c�̂� */
.contents .header-contents {
    padding-bottom: 0;
}


/* Information / ���m�点�y�[�W */
.news-wrapper {
    margin-bottom: 30px;
}

.menubar-wrapper {
    height: 50px;
    width: 100%;
    text-align: center;
    position: relative;
    
}
    
.menubar {
    position: absolute;
    padding: 0;
}

.menubar li {
    list-style: none;
}
    
.menubar li a {
    text-decoration: none;
}

.dropdown-menu {
    width: 310px;
}
    
/* ���C�����j���[�̃X�^�C�� */


.dropdown-menu > a {
    display: block;
    padding: 7px 0 7px 0px;
    background-color: #62C4F5;
    background-image: url(../images/arrow-dropdown1.png);
    background-position: 25px 50%;
    background-repeat: no-repeat;
    color: #fff;
    font-size: 0.93m;
    border-radius: 5px;
}
.dropdown-menu > .items {
    display: none;
    margin: 2px 0 0 0;
    padding: 0;
}

.dropdown-menu > .items li {
    display: block;
    padding: 5px 0;
    background: #9FD9F6;
    color: #fff;
    font-size: 0.9em;
    text-align: center;
}

.dropdown-menu > .items li:first-child {
    border-radius: 5px 5px 0 0;
}

.dropdown-menu > .items li:last-child {
    border-radius: 0 0 5px 5px;
}

.dropdown-menu > .items li:hover {
    background-color: #CEE3F6;
    cursor: pointer;
}

.dropdown-menu > .items li:active {
    background-color: #5882FA;
}

/* �N���X�̂��ē� */

#class-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

#class-list li {
    animation-name: fadein-pattern-1;
    animation-duration: 2s;
    animation-iteration-count: 1;
}

#class-list img {
    width: 100%;
}

#class-list a {
    display: block;
    color: inherit;
    text-decoration: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 15px;
}

#class-list a:hover {
    opacity: 0.7;
}

#class-list h1 {
    font-size: 16px;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 35px;
    height: 35px;
    margin-top: 5px;
    margin-bottom: 8px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
/*    background-image: url(../../class/images/class-icon/kodomo-color.png);*/
    background-repeat: no-repeat;
    background-position: left 0; 
}

#class-list .class-icon {
    width: 30px;
    height: 30px;
}

/* �t�B���^�{�^���S�̂̃X�^�C�� */
.wrapper-filter-btn,
.wrapper-fliter-btn-part2 {
    padding: 20px 0;
    height: 40px;
    position: relative;
}

.filter-btn, .filter-btn-part2 {
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    right: 0;
}

.filter-btn li,
.filter-btn-part2 li {
    float: left;
    margin: 0 3px 0 0;
}

.filter-btn li a,
.filter-btn-part2 li a {
    display: block;
    padding: 10px 10px 10px 40px;
    height: 20px;
    background-position: 5px 50%;
    background-repeat: no-repeat;
    border-radius: 5px;
    color: #fff;
    font-size: 0.8em;
    text-decoration: none;
}



/* �•ʂ̃X�^�C�� */
.filter-btn li.all a {
    background-image: url(../../class/images/class-icon/all-white.png);
    background-color: #66B72F;
}

.filter-btn li.kodomo a,
.filter-btn-part2 li.kodomo a {
    background-image: url(../../class/images/class-icon/kodomo-white.png);
    background-color: #de63a1;
}

.filter-btn li.kodomo_otona a,
.filter-btn-part2 li.kodomo_otona a {
    background-image: url(../../class/images/class-icon/kodomo_otona-white.png);
    background-color: #83ccce;
}

.filter-btn li.otona a,
.filter-btn-part2 li.otona a {
    background-image: url(../../class/images/class-icon/otona-white.png);
    background-color: #f4b542;
}

.filter-btn li.event a {
    background-image: url(../../class/images/class-icon/event-white.png);
    background-color: #8d66a9;
}

.filter-btn li.off a,
.filter-btn-part2 li.off a {
    background-color: #ddd;
}

/* �^�C���e�[�u���E��u���@�\�f�U�C��*/

.irregular-table {
    table-layout: fixed;
}

.class-tables table {
    margin-top: 20px;
    font-size: 15px;
    border-collapse: collapse;
    width: 100%;
}

.class-tables table td:first-child {
    width: 15%;
}

.class-tables table td:nth-child(2) {
    width: 35%;
}

.class-tables table th,
.class-tables table td {
    text-align: center;
    height: 30px;
    border: 1px solid #cccccc;
    padding: 5px 10px;
}


/* 2�R�����T�C�g */
.class-text,
.class-text-type2 {
    border: solid 1px #5882FA;
}

.class-news p,
.class-place p {
    font-size: 14px;
}

.main-side-wrapper {
    padding-bottom: 30px;
}

.mainbar .class-text,
.mainbar .class-text-type2 {
    padding: 8px;
}

.mainbar .class-text {
    padding-bottom: 20px;
}


.class-text h1,
.class-text-type2 h1{
    margin-top: 0;
    font-size: 20px;
    color: #5882FA;
    line-height: 1.3;    
}

.class-text p,
.class-text-type2 p {
    font-size: 14px;
    line-height: 2;
}

.class-text a {
    text-decoration: none;
    color: royalblue;
}

.access-note a {
    text-decoration: none;
    color: currentColor;
}

.access-note a:hover,
.access-note a:active {
    color: royalblue;
}

.class-text a:hover {
    color: #d03c56;
}

.wkshop-link {
    color: #d03c56;
    text-decoration: none;
}

.wkshop-link:hover {
    text-decoration: underline;
}


.mainbar ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.class-image1 {
    margin-top: 10px;
}

.class-image1 ul li {
    padding: 5px 0;
}

.class-image1 li,
.class-image2 li {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.class-image1 li {
    width: 50%;
    float: left;
}

.class-image1 li:first-child {
    padding-right: 5px;
}

.class-image2 li {
    width: 33.3333%;
    float: left;
    padding-right: 5px;
}

.class-image2 li:last-child {
    padding-right: 0;
}

.class-image1 img,
.class-image2 img {
    width: 100%;
    height: auto;
   height: 100%;
   object-fit: cover;
}


.price-note {
    text-align: right;
    margin-bottom: 0;
}
    
.class-timetable {
    width: 100%;
    margin-top: 10px;
    font-size: 14px;
    border-collapse: collapse;

}

.class-timetable td:first-child {
    width: 15%;
}

.class-timetable td:nth-child(2) {
    width: 35%;
}

.class-timetable td:nth-child(3) {
    width: 50%;
}

.class-timetable th, 
.class-timetable td {
    text-align: center;
    height: 30px;
    border: 1px solid #cccccc;
    padding: 5px 10px;
}

.class-note-1 {
    margin-top: 16px;
}

.class-schedule {
    margin-top: 15px;
}

.class-schedule a {
    color: inherit;
    text-decoration: none;
    font-size: 15px;
}

.timetable-fee h2 {
    margin-top: 20px;
    font-size: 15px;
    font-weight: normal;
}

.timetable-fee p {
    font-size: 14px;
}

.timetable-fee .attention {
    margin-top: 15px;
}

.timetable-fee dl {
    overflow: hidden;
    font-size: 15px;
    line-height: 1.5;
}

.timetable-fee dt {
    float: left;
}

.timetable-fee dd {
    margin: 0 0 0.5em 0;
    
}

.instructor-name {
    width: 80%;
    margin: 0 auto;
}

.class-instructors img {
    width: 100%;
}

.instructor-name p {
    padding-top: 10px;
    font-size: 16px;
    text-align: center;
}

.sidebar-blog ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-blog ul li {
    width: 90%;
    margin: 0 auto 10px auto;
}

.sidebar-blog ul li:first-child {
    margin-top: 20px;
}

.sidebar-blog ul li a {
    display: block;
    text-decoration: none;
    color: #fff;
}

.sidebar-blog ul li a:hover {
    opacity: 0.8;
}


li.uesen-blog div {
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    
}

li.uesen-blog div img {
    width: 100%;
    float: left;
}

.open-class-list ul,
.open-class-list p {
    font-size: 14px;
}

li.secondary div {
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

li.secondary div img {
    width: 100%;
    
}

.sidebar aside {
    margin-top: 15px;
}

li.uesen-blog a {
    display: block;
}

.sidebar-info {
    padding-top: 10px;
}

#sidebar-newslist {
    margin: 0;
    padding: 0;
    list-style: none;
}

#sidebar-newslist li {
    font-size: 14px;
    padding: 10px;
    border-bottom: dotted 1px #dddddd;
}


#sidebar-newslist span {
    font-weight: bold;
    line-height: 1.75;
}

#sidebar-newslist a {
    text-decoration: none;
    color: inherit;
}

#sidebar-newslist a:hover {
    color: #5882FA;
}

#sidebar-newslist p {
    margin-bottom: 5px;
}

.sidebar-info .more {
    text-align: right;
    font-size: 14px;
}

.sidebar-info .more i {
    margin-right: 5px;
    padding-top: 10px;
    color: #888888;
}

.sidebar-info .more a {
    text-decoration: none;
    color: inherit;
    
}

.sidebar-info .more a:hover {
    color: #5882FA;
}

/*�C���X�g���N�^�[*/
/* �u�t�Љ� */


.instructor-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.instructor-list li {
    float: left;
    box-sizing: border-box;
    margin-right: 100px;
}

.instructor-list img {
    max-width: 100%;
    height: auto;
    border: none;
}

.instructor-list .instructor-info {
    max-width: 100%;
    text-align: center;
    padding-top: 7px;
    font-size: 14px;
}

.instructor-list .instructor-img {
    height: 180px;
}

.instructor-img img {
    height: 100%;
}
/* �N���X�y�[�W */

/* �e�L�X�g�Ɖ摜�̃X�y�[�X */

.class-image-wrapper {
    margin-top: 15px;
}

/*�N���X�̉摜�������тɂ��� */
.class-image1-single img {
    width: 100%;
    height: 100%;
}

.class-image1-single {
    float: left;
    height: 370px;
    width: 50%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 15px;
}

.class-image2-multiple {
    float: left;
    width: 50%;
}

.class-image2-multiple ul {
    height: 370px;
    text-align: center;
}

.class-image2-multiple li {
    box-sizing: border-box;
    padding-bottom: 5px;
    height: 33.33333%;
}

.class-image2-multiple li:last-child {
    padding-bottom: 0;
}
.class-image2-multiple li img {
    width: 50%;
    height: 100%;
    
}

/* �^�C���e�[�u���E��u���y�[�W */
/* ���C���o�[ */

.entry-requirement-part1 h1,
.entry-requirement-part2 h1 {
    border: solid 1px skyblue;
    background-color: #5882FA;
    padding: 10px 10px;
    font-size: 16px;
    color: white;
    line-height: 1.4;
}

.requirement-items li {
    list-style: none;
    line-height: 1.5;
}

.entry-requirement-part2 .requirement-items li {
    margin-left: 20px;
    list-style: disc;
}

.requirement-items .price {
    font-size: 23px;
    color: #5882FA;
}

.requirement-items small {
    font-size: 15px;
}

.entry-requirement-part1 {
    margin-bottom: 20px;
}

.entry-requirement-part2 {
    margin-bottom: 25px;
}


/* �^�C���e�[�u��*/
.class-tables {
    margin-top: 40px;
}

.class-tables p {
    font-size: 15px;
}

/*�N���X�e�[�u���̕\���̐؂�ւ�*/
.table-hide {
    display: none;
}

.table-show {
    display: block;
    animation-name: fadein-pattern-2;
    animation-duration: 2.5s;
    animation-iteration-count: 1;
}

/* �ėp�N���X */
.title-type01 {
    font-size: 25px;
    font-family: 'Handlee', cursive;
    text-align: center;
    color: #5882FA;
}

.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

.heading-type1 {
    font-size: 16px;
    font-weight: bold;
    color: #5882FA;
    border-left: solid 5px #5882FA;
    border-bottom: solid 1px #5882FA;
    padding: 5px 10px;
    line-height: 1.375;
    margin-top: 20px;
}

.heading-type2 {
    font-size: 20px;
    color: #5882FA;
    letter-spacing: 2.5px;
    padding-bottom: 5px;
    border-bottom: solid 1px #5882FA;
    font-family: 'Handlee', cursive;
}

.heading-kodomo {
    font-size: 16px;
    font-weight: bold;
    color: #de63a1;
    border-left: solid 5px #de63a1;
    border-bottom: solid 1px #de63a1;
    padding: 5px 10px;
    line-height: 1.375;
    margin-top: 20px;
}

.heading-kodomo-otona {
    font-size: 16px;
    font-weight: bold;
    color: #83ccce;
    border-left: solid 5px #83ccce;
    border-bottom: solid 1px #83ccce;
    padding: 5px 10px;
    line-height: 1.375;
    margin-top: 20px;
}

.heading-otona {
    font-size: 16px;
    font-weight: bold;
    color: #f4b542;
    border-left: solid 5px #f4b542;
    border-bottom: solid 1px #f4b542;
    padding: 5px 10px;
    line-height: 1.375;
    margin-top: 20px;
}

.btn a {
    background-color: #5882FA;
    color: #ffffff;
    font-size: 15px;
    line-height: 30px;
    width: 185px;
    display: block;
    text-align: center;
    margin: 30px auto 0 auto;
    border-radius: 5px;
    border: 3px solid #5882FA;
    text-decoration: none;
}

.btn a:hover {
    text-decoration: none;
    background-color: #ffffff;
    color: #5882FA;
}

section.otona dl {
    overflow: hidden;
    font-size: 14px;
}

section.otona dt {
    float: left;
}

section.otona dd {
    margin: 0 0 0.5em 0;
}

.f-red {
    color: red;
    font-weight: bold;
    font-size: 13px;
}

.f-blue {
    color: royalblue;
    font-weight: bold;
    font-size: 13px;
}

.f-orange {
    color: darkorange;
}

.f-purple {
    color: purple;
}

.f-pink {
    color: deeppink;
}

.f-yellowgreen {
    color: yellowgreen;
}

.f-darkblue {
    color: darkblue;
}

.f-darkgold {
    color: darkgoldenrod;
}

.f-navy {
    color: navy;
}

.f-darkgreen {
    color: darkgreen;
}

.f-brown {
    color: brown;
}

.atten-msg {
    font-size: 15px;
    padding: 10px 0; 
    background-color: yellow;
    text-align: center;
}

/* �N���X�y�[�W */
.class-timetable {
    margin-top: 20px;
}

.class-dates {
    display: flex;
    justify-content: space-between
}

.class-dates > li {
    width: 32%;
}

.class-dates > li > ul li {
    text-align: center;
}

.class-dates h2 {
    margin-top: 0;
    font-size: 13px;
}

.class-dates li {
    font-size: 14px;
}

.class-month {
    border: 1px solid #666666;
    border-radius: 5px;
    padding: 5px 10px;;
    box-sizing: border-box;
    text-align: center;
    
}

/* �u�t�Љ�y�[�W */
.instructor-top-part {
    border-bottom: solid 1px #5882FA;
    margin-bottom: 20px;
}

.instructor-daihyo {
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.instructor-daihyo .daihyo-pic {
    width: 90%;
    margin: 0 auto;
}

.instructor-daihyo .daihyo-pic img {
    width: 100%;
}

.instructor-daihyo .instructor-note {
    width: 90%;
    margin: 10px auto;
    text-align: center;
}


.instructors-contents {
    margin: 0;
    padding: 0;
    list-style: none;
}

.instructor-note {
    margin-top: 10px;
}

.instructor-note span {
    font-size: 19px;
    font-weight: bold;
}


/* �����ē� */
.contact-table h1 {
    margin-top: 0;
    margin-bottom: 30px;
    font-size: 20px;
    text-align: center;
}

.contact-table table {
    width: 100%;
}

.contact-table table tr td iframe {
    max-width: 100%;
}

.contact-table table tr th,
.contact-table table tr td {
    font-size: 14px;
    line-height: 1.7;
    padding: 10px 10px;
}

.room-navi {
    margin: 30px 0;
}

.room-map img {
    max-width: 100%;
}

/*�C�x���g���݃T�C�g*/
/*Summer ART 2019*/

.sp-headerimage img {
    display: block;
}

.pc-header-image img {
    display: none;
}


.bg-summer-art {
    background: url(../../class/event-class/common/images/summer-art-class/summer-back.png);
    padding-top: 50px;
}

.event-top-image {
    margin-top: 30px;
    margin-bottom: 0px;
}
.event-top-image img {
    width: 100%;
/*    margin-bottom: 40px;*/
}

.summer-main-contents {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 80px;
}

.summer-classlist h1 {
    text-align: center;
    margin: 0;
    padding: 10px 0 15px 0;
    font-size: 18px;
    font-weight: bold;
}

.summer-classlist p {
    margin-bottom: 0;
    font-size: 15px;
    line-height: 160%;
}

.summer-classlist .info {
    font-size: 14px;
    margin-bottom: 20px;
}

.summer-classlist .info small {
    font-size: 12px;
}

/* Totemo Tanoshii Tshirts�W(TTT�W) ���݃T�C�g*/

.ttt-main-contents {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 50px;
}

.ttt-main-contents p {
    line-height: 1.7;
}

.ttt-top-image {
    margin-top: 30px;
    margin-bottom: 0px;
}

.ttt-top-image img {
    width: 100%;
/*    margin-bottom: 40px;*/
}

.box2 {
    background-color: yellow;
}

.ttt-opening {
    margin-bottom: 20px;
}
.ttt-opening h1,
.ttt-opening h2 {
    font-weight: normal;
}

.ttt-opening h1 {
    color: darkgreen;
}

.ttt-opening h2 {
    font-size: 20px;
}

.ttt-title {
    background: url(../../event/common/images/totemo-tanoshii-tshirts-ten/sample-t-shirt-slide.jpg) right 0px top 0px no-repeat;
    background-size: 70% auto;
}

.ttt-intro {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 10px;
    padding-left: 10px;
}

.ttt-work-list {
    border-bottom: double;
    border-color: lightgray;
    padding-bottom: 20px;
}

.ttt-work-list ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ttt-work-list  li{
    width: 25%;
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 5px;
}





.ttt-work-list li:nth-child(5) {
    clear:both;
}


.ttt-work-list li .text {
    padding: 10px 0px;
    font-size: 15px;
}

.ttt-work-list li img {
    max-width: 100%;
    vertical-align: text-bottom;
    height: auto;
    border: none;
    
}

.ttt-ws {
    margin-top: 20px;
}

.ttt-ws-logo img {
    width: 100%;
}

.ttt-ws-intro {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.ttt-ws-top-wrapper {
    margin-bottom: 40px;
    border-bottom: solid 1px #dadada;
    padding-bottom: 20px;
}

.ttt-ws-contents h1 {
    font-weight: normal;
    font-size: 25px;
    padding: 5px;
}

.ttt-ws-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ttt-ws-list li {
    margin: 0 0 10px 0;
    padding: 10px;
    border-bottom: 1px solid #dadada;
}


.ttt-ws-list .note {
    padding-top: 0px;
    font-size: 17px;
}

.ttt-ws-list li img {
    width: 100%;
}

.ttt-access {
    margin-top: 40px;
    margin-bottom: 40px;
}

.ttt-access-note {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 15px;
}

.ttt-access-note h1 {
    font-weight: normal;
    font-size: 25px;
    color: purple;
    text-align: center;
}

.ttt-access-note ul {
    margin: 0;
}

.ttt-access-note ul li {
    line-height: 1.7;
}

.ttt-access-map img {
    width: 100%;
}

/* ############### 599px�ȉ� ############### */
@media (max-width: 599px) {
    .ttt-title {
        border-bottom: double;
        border-color: lightgray;
    }
    
    .ttt-work-list li {
        width: 50%;
    }
    
    .ttt-work-list li:nth-child(3) {
        clear: both;
    }
    
    .ttt-work-list li:last-child {
        width: 100%;
    }   

    .ttt-work-list li:last-child img {
        width: 100%;
    }
    
    .ttt-ws-intro {
        padding-top: 20px;
    }
    
    .ttt-ws-contents h1 {
        font-size: 18px;
    }
}

/* ############### 600px�ȏ� ############### */
@media (min-width: 600px) {
    
    .ttt-title {
        float: left;
        width: 45%;
    }

    .ttt-intro {
        float: left;
        width: 55%;
    /*    background: pink;*/
    }
    
    .ttt-work-list li {
        padding: 10px;
    }
    
    .ttt-work-list li:last-child {
        width: 50%;
    }   

    .ttt-work-list li:last-child img {
        width: 100%;
    }
    
    .ttt-ws-logo {
        float: left;
        width: 40%;
    }
    
    .ttt-ws-intro {
        float: left;
        width: 60%;
        padding-top: 50px;
        padding-left: 20px;
    }
    
    .ttt-ws-list li {
        overflow: hidden;
        padding: 20px;
        text-align: left;
    }
    
    .ttt-ws-list .thumbnail {
        width: 35%;
    }
    
    .ttt-ws-list li img {
        float: left;
        margin-right: 20px;
        width: 100%;
    }
    
    .ttt-access-map {
        width: 35%;
        float: left;
    }
    
    .ttt-access-note {
        float: left;
        width: 65%;
    }
}

/* ############### 1040px�ȏ� ############### */
@media (min-width: 1040px) {
    /* Totemo Tanoshii Tshirts�W�@�S�̂̉������Œ� */
    .ttt-top-image, .ttt-main-contents {
        width: 990px;
        margin-left: auto;
        margin-right: auto;
    }
    
}

/*�p�\�R���p�̉����ѕ\��*/
/*�w�b�_�[��ʂ��p�\�R���p�ɐ؂�ւ� */
@media (min-width: 768px) {
    .classlist-contents {
        display: flex;
        flex-flow: row wrap;
        -ms-flex-flow:row wrap;
        justify-content: space-between;
    }
    
    .pc-header-image img {
        display: block;
    }
    
    .sp-header-image img {
        display: none;
    }
}


.classlist-contents {
    list-style: none;
    margin: 0;
    padding: 0;
}

.classlist-contents li {
    flex: 0 0 32%;
    display: flex;
    flex-flow: column;
    margin: 0 1% 60px 0;
    padding: 10px;
    border: 1px dashed royalblue;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.classlist-contents li:nth-child(3n) {
    margin-right: 0;
}

.classlist-contents ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.top-spacing {
    margin-top: 80px;
}

.top-spacing-2 {
    margin-top: 50px;
}

.top-spacing-3 {
    margin-top: 0px;
}

.top-spacing-4 {
    margin-top: 15px;
}

.summer-class-contents {
    padding-bottom: 60px;
}

.summer-class-contents p {
    font-size: 14px;
    
}

.summer-class-note {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 5px;
}

.summer-class-note-top {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.summer-class-image-bottom {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: 10px;
    
}

.img-right img {
    float: right;
}

.summer-class-image-bottom img {
    width: 48%;
}

.summer-class-image img{
    width: 100%;
}

.summer-class-contents-top p {
    font-size: 14px;
}

/*�����Ɖ摜�������ׂɂ���*/
.summer-class-note {
    float: left;
    width: 55%
}

.summer-class-image {
    float: left;
    width: 45%
}

.classlist-contents li {
    position: relative;
    background: #fff;
}

/*�o�b�W*/
.badge {
    position: absolute;
    left: 10px;
    top:-45px;
    padding-top: 5px;
    width: 55px;
    height: 50px;
    background-color: forestgreen;
    text-align: center;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    box-shadow: 0px 6px 6px 0;
}

/*�p���b�g�}�[�N*/
.mark {
    position: absolute;
    left: 80px;
    top: -45px;
    padding-top: 5px;
    width: 45px;
    height: 45px;
}

.mark img {
    width: 100%;
}

.summer-main-contents p.note{
    display: inline-block;
    color: darkgreen;
    font-size: 15px;
    background: white url(../../class/event-class/common/images/summer-art-class/pallet.png) left 0px top 5px no-repeat;
    background-size: 45px;
    padding: 10px 10px 20px 60px;
}

.classlist-contents .btn-detail {
    display: block;
    background-color: dodgerblue;
    color: #fff;
    font-size: 15px;
    text-align: center;
    padding: 5px;
    margin: auto 20px 10px 10px;
    border-radius: 10px;
    border: 3px solid dodgerblue;
    text-decoration: none;
}

.classlist-contents .btn-detail:hover {
    background-color: #ffffff;
    color: dodgerblue;
}

.summer-main-contents p.btn {
    padding-bottom: 30px;
}

/*�N���X�X�P�W���[�� */
.class-schedule a:hover {
    color: #87cefa;
}

@keyframes fadein-pattern-1 {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes fadein-pattern-2 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/*�N���X�󂫏� */

.status {
    display: inline-block;
    padding: 3px;
    border-radius: 5px;
    color: #fff;
    font-size: 12px;
    letter-spacing: 1px;
    line-height: 16px;
}

.stop {
    background-color: #d03c56;
}


/* ############### 359px�ȉ� ############### */

@media (max-width: 359px) {
    /* �T�C�g�� */
    .site img {
        width: 225px;
        height: auto;
    }
}

@media (max-width: 375px) {
    /* �T�C�g�� */
    .bread li a {
        font-size: 13px;
    }
        
}


/* ############### 599px�ȉ� ############### */

@media (max-width: 599px) {
    
    /* �i�r�Q�[�V���� */
    .menu li a {
        padding: 10px 7px;
        font-size: 11px;
    }
    
    .slide a.prev,
    .slide a.next {
        top: 40%;
    }
    
    /* �X���C�h-�L���b�`�R�s�[*/
    .catch {
        padding: 5px 10px;
        font-size: 12px;
    }
    
    /* �N���X�̂��ē� */
    .page-title-wrapper {
        margin-bottom: 0;
    }
    
    .main-contents {
        padding-top: 0;
    }
    
    /* �t�B���^�{�^���S�̂̃X�^�C�� */
    .wrapper-filter-btn,
    .wrapper-filter-btn-part2 {
        padding: 0 0 20px 0;
        border-bottom: solid 1px #dddddd;
        height: 150px;
        margin-top: 0;
        margin-bottom: 20px;
    }
    
    .filter-btn,
    .filter-btn-part2 {
        position: static; 
    }
    
    .filter-btn li {
        position: static;
/*        margin: 0 1.666666% 2% 0;*/
        margin: 0 1.666666% 2% 0;
        width: 31%;
        text-align: center;
    }
    
    .filter-btn-part2 li {
        position: static;
        margin: 0 1.66666% 2% 0;
        width: 31.5%;
        text-align: center;
    }
    
    .wrapper-filter-btn .filter-btn li:last-child {
        margin: 0;
    }
    
    .filter-btn li a,
    .filter-btn-part2 li a {
        padding: 45px 0 10px 0;
        background-position: 50% 10px;
        font-size: 0.8em;
    }
    
    /*�N���X�y�[�W�@�N���X�����̏��� */
    .class-text p {
        line-height: 1.725;
    }
    
    /*�N���X�y�[�W �S���u�t���� */
    .instructor-list li {
        width: 45%;
        margin: 0;
        padding-right: 30px;
    }
    
    .instructor-list li img {
        width: 100%;
    }
    
    /*�N���X�y�[�W �S���u�t�̏��� */
    .instructor-list .instructor-info {
        font-size: 15px;
    }
    
    .instructor-list li.uesen {
        width: 100%;
    }
    
    /*�^�C���e�[�u���E��u���y�[�W */
    /*�\�̕\���ύX */
    
    tbody {
        display: block;
        width: 100%;
    }
    
/*    8���̃N���X�ē�*/
    #aug-schedule-table {
        display: block;
        background-color: white;
    }
    
    /* ���o���s */
    #aug-schedule-table th {
        display: none;
    }
    
    #aug-schedule-table tr {
        display: block;
        
    }
    
    #aug-schedule-table tr td {
        display: block;
        border-left-width: 0;
        border-right-width: 0;
    }
    
    #aug-schedule-table tr td:first-child {
        padding: 10px;
        border-top-width: 0;
        border-bottom-width: 0;
    }
    
    #aug-schedule-table tr td:nth-child(2),
    #aug-schedule-table tr td:nth-child(3),
    #aug-schedule-table tr td:nth-child(4){
        background-color: white;
        text-align: left;
        padding: 10px 10px 10px 30px;
        border-top-width: 0;
        
    }
    
    #aug-schedule-table tr td:nth-child(4) {
        border-bottom: none;
        padding-bottom: 10px;
    }
    
    .display-switch {
        display: inline-block;
    }
    /* �s�ύX */
    .row-change:after {
        content: "\A";
        white-space: pre;
    }
    
    
}

/* ############### 600px�ȏ� ############### */
@media (min-width: 600px) {
    /*Class �N���X�̂��ē��@�N���X�T���l�C���������тɂ���*/
    #class-list li {
        float: left;
        width: 33.3333%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-left: 10px;
    }

}

/* ############### 767px �ȉ� ############### */
@media (max-width: 767px) {
    p {
        font-size: 15px;
        line-height: 1.5;
    }
    
    header {
        border-bottom: solid 1px #dddddd;
    }
    
    /*2019�N�T�}�[�N���X���݃T�C�g �w�b�_�[�̉��������� */
    #summer-2019-header {
        border-bottom: none;
    }
    
    .header-logo {
        padding-bottom: 10px;
    }
    
    .header-trial img {
        width: 100%;
        height: auto;
    }

        
    .header-navbtn {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 30;
        width: 62px;
        height: 62px;
        background-image: url(../../common/images/navbtn.png);
        background-size: 62px 62px;
/*        background-color: #8bb15a;*/
        background-color: #87cefa;
    }

    .nav-container {
/*        background: #638a30;*/
        background: #87cefa;
        box-shadow: 0px 5px 5px rgba(0,0,0,0.4);
    }
    
    .globalnav li a {
        display: block;
        padding: 15px 20px;
        border-bottom: 1px solid #afeeee;
        line-height: 100%;
        color: #ffffff;
    }
    
    .globalnav li a:hover,
    .globalnav li a.current {
        background: #87cefa;
/*        background: #8bb15a;*/
        color: #ffffff;
    }

    .instructors {
        display: block;
    }

    
    /* ===========Javascript�pCSS ===========*/
    /* �X�}�[�g�z����ʂł̃i�r�Q�[�V����*/
    
    /* �i�r�Q�[�V�����͍ŏ��͔�\�� */
    #js-slidemenu {
        display: none;
    }
    
    /* �i�r�Q�[�V�������J�����Ƃ��ɉ�ʂ��Â����鏈���̂��߂�CSS */
    
    .js-slidemenu-effect {
        width: 100%;
        height: 100%;
        background: #000;
        opacity: 0.4;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 10;
    }
    
    /* �R���e���c�y�[�W�̂�*/
    /*BOXA�̉��Ɍr����}�� */
    .contents .header-contents {
        border-bottom: solid 1px #dddddd;
    }
    /*BOXA�̉��̌��Ԃ𒲐�*/
    .contents .header-contents {
        padding-bottom: 10px; 
    }
    
    /* ���m�点�F�J�e�S���[�{�^�� */
    
    .menubar-wrapper {
        display: inline-block;
    }
    
    .menubar {
        width: 100%;
    }
    
    .dropdown-menu {
        width: 100%;
    }
    
    /* ��\���A */
    
    .daihyo-message {
        border-bottom: solid 1px #dddddd;
    }
    
    .daihyo-message-text p {
        font-size: 14px;
        line-height: 1.5;
    }
    
    .text-right {
        text-align: right;
    }
    
    .point-text-1 h2, 
    .point-text-2 h2, 
    .point-text-3 h2, 
    .point-text-4 h2 {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-top: 10px;
        padding-left: 50px;
        display: inline-block;
        width: 100%;
        height: 60px;
        margin: 0px;
    }
    
    .point-text-1 p,
    .point-text-2 p,
    .point-text-3 p,
    .point-text-4 p {
        margin-top: 0;
        font-size: 14px;
    }

    .point-text-1 h2 {
        background: url(../../about/images/no.1.png) left 0 top 0 no-repeat;
        background-size: 40px 40px;
    }

    .point-text-2 h2 {
        background: url(../../about/images/no.2.png) left 0 top 0 no-repeat;
        background-size: 40px 40px;
    }

    .point-text-3 h2 {
        background: url(../../about/images/no.3.png) left 0 top 0 no-repeat;
        background-size: 40px 40px;
    }

    .point-text-4 h2 {
        background: url(../../about/images/no.4.png) left 0 top 0 no-repeat;
        background-size: 40px 40px;
    }
    
    /*�N���X�y�[�W ART �p�\�R�� */
    .class-image1-single {
        margin-bottom: 15px;
    }
    
    /* �u�t�Љ�y�[�W */
    
    .instructors-contents li {
        overflow: hidden;
        margin-bottom: 15px;
    }

    li .instructor-pic {
        width: 40%;
        float: left;
    }

    li .instructor-pic img {
        width: 100%;
        height: auto;
    }

    li .instructor-note {
        width: 50%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-left: 20px;
        float: left;
    }
    
    /* �����ē��y�[�W */
    /*�\���C�A�E�g�̕ύX */
    
    .contact-table table {
        display: block;
    }
    
    .contact-table table tr {
        display: block;
        
    }
    
    .contact-table table th {
        display: block;
        text-align: left;
        background-color: #ebf4f4;
    }
    
    .contact-table table tr td {
        display: block;
    }
    
    .contact-table tbody {
        display: block;
        width: 100%;
    }
    
    /* �s�ύX */
    .row-change:after {
        content: "\A";
        white-space: pre;
    }
    
    #page-top {
        position: fixed;
        right: 5px;
        bottom: 20px;
        cursor: pointer;
    }
    
/*    8���̋����ē�*/
    
    
    .timetable-top {
        margin-top: 15px;
    }
    
    .timetable-box2,
    .timetable-box3 {
        margin-top: 20px;
    }
    
    .timetable-box3 .note {
        display: none;
    }
    
    .timetable-box3 .note-sp {
        display: block;
    }
    
    
}

/* ############### 768px�ȏ� ############### */
@media (min-width: 768px) {
    
    header {
        margin-top: 20px;
    }

    
    /* �w�b�_�[ */
    .header-left-side {
        float: left;
    }
    
    .header-right-side {
        float: right;
    }
    
    .header-container {
        overflow: hidden;   
    }
    
    .header-navbtn {
        display: none;
    }
    
    
    #menubtn {
        display: none;
    }
    
    /* �i�r�Q�[�V���� */
    /*    �S�y�[�W�F�w�b�_�[*�@�O���[�o���i�r�������тɂ���*/
    
    .nav-container {
        position: relative;
        top: 0;
        left: 0;
        padding: 0 20px 0 20px;
    }
    
    .globalnav {
        overflow: hidden;
        border-top: 1px solid #dddddd;
        border-bottom: 1px solid #dddddd;
    }
    
    .globalnav li {
        float: left;
        list-style: none;
        width: 20%;
    }
    
    .globalnav li a {
        display: block;
        padding: 10px 0;
        text-align: center;
        font-size: 15px;
    }
    
    .globalnav li:nth-child(2) {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-right: 30px;
    }
    
    .globalnav li:nth-child(4) {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-left: 40px;
    }
     
    .globalnav li a:hover,
    .globalnav li.current a {
        color: skyblue;
    }
    

    #js-slidemenu {
        display: block !important;
    }
    
    .menu ul {
        margin: 0;
        padding: 0;
        list-style: none;
        border-style: solid;
        border-width: 1px 0;
        border-color: #CCCCCC;
    }

    .menu li {
        float: left;
        width: auto;
    }
    
    .menu li a {
        display: block;
        padding: 10px 37px;
        color: #000000;
        font-size: 14px;
        text-decoration: none;
    }
    
    .menu li a:hover {
        color: #5882FA;
    }
    
    /* ���O�E�A�g���G�Ƃ� */
    .daihyo-message {
        margin-top: 30px;
    }
    
    /* �^�C���e�[�u���E��u�� */
    .main-side-wrapper {
        margin-top: 20px;
    }
    
    /* ���m�点�@*/
    
    .news-wrapper {
        margin-top: 25px;
    }
    
    .news-list li span.title {
        display: inline-block;
        max-width: 540px;
        margin-top: 0;
    }
    
    .news-list li {
        width: 80%;
    }
    
    
/*     �S�y�[�W�F�w�b�_�[�̃{�b�N�X�����ɕ��ׂ�ݒ� */

/*
    .top-slide {
        margin-top: 50px;
    }
*/
    .top-slide {
        margin-top: 50px;
    }
    
    .top-slide img {
        position: relative;
        top: -25px;
    }
    /* �g�b�v�y�[�W�F�j���[�X�����ɕ��ׂ�ݒ�*/
    .news-list-1 {
        float: left;
        width: 65%;
        padding-right: 10px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    .news-list-2 {
        float: right;
        width: 30%;
    }
    
    /* �g�b�v�y�[�W:�N���X�{�b�N�X�����ɕ��ׂ�ݒ� */
    
    .top-classlist-1 {
        float: left;
        width: 32%;
        margin-right: 2%;
    }
    
    .top-classlist-2 {
        float: left;
        width: 32%;
        margin-right: 2%;
    }
    
    .top-classlist-3 {
        float: left;
        width: 32%;
    }
    
    /* �g�b�v�y�[�W:�o�[�i�[�����ɕ��ׂ�ݒ� */
    
    .top-classlist-banner-1 {
        float: left;
        width: 50%;
        
    }
    
    .top-classlist-banner-2 {
        float: left;
        width: 50%;
    }
    
    /* ���m�点�y�[�W*/
    
    .news-wrapper {
        padding: 20px 50px 20px 50px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        border: 20px solid #fce377;
        border-image-source: url(../../news/images/border.png);
        border-image-slice: 60;
        border-image-width: 60px;
        border-image-repeat: repeat;
    }
    
    /* ���O�E�A�g���G�Ƃ́H*/
 
    
    /* �摜�ƕ��͂����ɕ��ׂ� */
    .point-text-odd {
        width: 55%;
        float: right;
/*        margin-right: 2.5%;*/
    }
    
    .point-image-odd {
        width: 40%;
        float: left;
/*        margin-left: 2.5%;*/
    }
    
    .point-text-even {
        width: 55%;
        float: left;
    }
    
    .point-image-even {
        width: 40%;
        float: right;
/*        margin-right: 2%;*/
    }
        
    .bg-extend {
        position: relative;
    }    
    .bg-color-01 {
        background-color: #e0ffff;
    }

    .bg-color-02 {
        background-color: #e5f4ff;
    }
    
    .header-contents {
        margin-bottom: 20px;
    }
    
    /* about ���O�E�A�g���G�͂ǂ�ȂƂ��� */
    .point-text-1, .point-text-3 {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-right: 70px;
    }

    .point-text-2, .point-text-4 {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-left: 90px;
    }

    .point-text-1, point-text-3 {
        background: url(../../about/images/no.1.png) right 0px top 10px no-repeat;
    }

    .point-text-2 {
        background: url(../../about/images/no.2.png) left 0px top 10px no-repeat;
    }

    .point-text-3 {
        background: url(../../about/images/no.3.png) right 0px top 10px no-repeat;
    }

    .point-text-4 {
        background: url(../../about/images/no.4.png) left 0px top 10px no-repeat;
    }
    
    /* ���C���o�[�ƃT�C�h�o�[�����ɕ��ׂ�ݒ� */
    .mainbar {
        float: left;
        width: 70%;
    }
    
    .sidebar {
        float: left;
        width: 30%;
    }
    
    /* ���C���o�[�ƃT�C�h�o�[�̍��E�̊Ԋu */
    .mainbar {
        padding-right: 25px;
        border-right: 1px solid #5882FA;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    .sidebar {
        padding-left: 15px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    /* �T�C�h�o�[�@�u���O�o�[�i�[ */
    
    .sidebar-blog ul li {
        width: 100%;
    }
    
        
/*�N���X�y�[�W */
    
    .class-upper {
        margin-bottom: 15px;
    }
    
    .class-text,
    .class-text-type2 {
        font-size: 14px;
    }
    
    .instructor-list li {
        float: left;
        padding-right: 50px;
        margin: 0;
    }

/* �u�t�Љ�y�[�W */
    
    .instructor-daihyo {
        width: 40%;
        padding-bottom: 0;
    }
    
    .daihyo-pic img {
        width: 100%;
    }

    .instructor-daihyo .instructor-note {
        width: 100%;
        text-align: center;
    }

    .instructor-daihyo {
        padding-left: 10px;
    }
    
    .instructors-contents {
        overflow: hidden;
        margin-bottom: 10px;
    }
    
    .instructors-contents li {
        float: left;
        width: 31%;
    }
    
    .instructors-contents li:first-child {
        padding-left: 50px;
    }
    
    /* �����ē� */
    
    .contact-table table tr th {
        width: 30%;
        background-color: #ebf4f4;
    }
    
    .contact-table table tr td {
        width: 80%;
    }
    
    .contact-table table tr th,
    .contact-table table tr td {
        padding: 25px;
    }
    
    #page-top {
        position: fixed;
        right: 60px;
        bottom: 20px;
        cursor: pointer;
    }
    
    .copyright h1,
    .copyright p {
        text-align: center;
    }
    
/*    �^�C���e�[�u���E��u��*/
    .entry-requirement-part1 .requirement-items li {
        float: left;
        margin-right: 30px;
        
    }
    
/*    8���̋����ē�*/
    .timetable-top {
        overflow: hidden;
    }
    
    .timetable-box1 {
        width: 23%;
        float: left;
        margin-right: 4%;
    }
    
    .timetable-box1 .atten {
        margin-top: 30px;
    }
    
    .timetable-box2 {
        width: 45%;
        float: left;
        margin-right: 5%;

    }
    
    .timetable-box3 {
        width: 10%;
        float: left;
    }
    
    .timetable-box3 .note {
        display: block;
        font-size: 25px;
        color: red;
        font-weight: bold;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }
    
    
    /* �s�ύX */
    .vertical-row-change:after {
        content: "\A";
        white-space: pre;
    }
}


/**********************/
/* 企画講座 */
/**********************/
.event-info {
    color: #333; 
    font-size: 14px!important; 
    line-height: 1.5; 
    background-color: #ffefd5; 
    padding: 16px; 
    border-radius: 10px;
}

.event-info-thumbnail {
    margin-top: 16px;
    display: inline-block;
    width: 85%;
}

/**********************/
    
    
/* ############### 900px�ȏ� ################ */
@media (min-width: 900px) {
    
    /*�N���X�y�[�W�@���E�ɕ��ׂ�<�p�^�[���P> */
    .class-text {
        float: left;
        margin-right: 5px;
        width: 55%;
        height: 320px;
    }
    
    .class-text p,
    .class-text-type2 p {
        line-height: 1.725;
    }
    
    .class-image1 {
        width: 40%;
        float: right;
        margin-top: 0;
        height: 320px;
    }
    
    .class-image1 li {
        width: 100%;
    }
    
    .class-image1 li:first-child {
        padding-top: 0;
        margin-bottom: 5%;
    }
    
    .class-image1 li img {
        height: 155px;
    }
    
    

    
}


/* ############### 1025px�ȏ� ################ */
@media (min-width: 1025px) {

    .daihyo-message {
        background-color: #e5f4ff;
        height: 630px;
    }
    
    .daihyo-message-inner {
        position: relative;
    }

    .daihyo-message-text {
        position: absolute;
        right: -130px;
        top: 60px;
        height: 520px;
        background-color: rgba(255,255,255,0.9);
        width: 60%;
        padding: 10px 25px;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 1;
    }
    
    .daihyo-message-text p {
        font-size: 14.5px;
        line-height: 1.5;
    }
    
    .daihyo-message-image {
        padding-top: 30px;
    }
    
}

/* ############### 1040px�ȏ� ############### */
@media (min-width: 1040px) {
    /* �S�̂̉������Œ� */
    .header-container, .nav-container, .top-slide-inner, .news-inner, .news-wrapper, .headerA-inner, .footer-inner, .top-classlist, .top-classlist-banner, .page-title-wrapper, .main-contents, .daihyo-message-inner, .main-side-wrapper, .header-top {
        width: 960px;
        margin-left: auto;
        margin-right: auto;
    }
    
    /*Summer ART ���݃T�C�g */
    .event-top-image, .summer-main-contents {
        width: 990px;
        margin-left: auto;
        margin-right: auto;
    }
}