@charset "utf-8";


/* ///////////////////////////////////////////////

 Global Style

/////////////////////////////////////////////// */

#class{ width:100%; background:#F3F7F0; margin-bottom:20px;}
#class h2{ padding:25px 24px 31px; background:url(../img/bg_ttl.jpg) right top no-repeat;}



/* ---------- H4 Title & Button Style ----------  */

div.ttl_style,
div.btn_style,
#class_form div.submit,
#class_form div.form_btn { border:1px solid;}

#pgcm div.ttl_style h4,
#pgcm div.btn_style a,
#class_form div.submit input,
#class_form div.form_btn input { margin:1px; border:1px solid; color:#FFF; font-weight:bold; text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.1);}

#pgcm div.btn_style a:hover {text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);}

div.ttlbox_style { padding-bottom:10px; }
div.ttlbox_style h4 { padding:20px; font-weight:bold; color:#FFF; text-align:center; line-height:140%; text-shadow:none;}
div.ttlbox_style h4 { font-size: 13px; font-size: 1.3rem; } /* =16px */

div.ttlbox_style.color_pink h4{ background-color:#FD9BB9;}
div.ttlbox_style.color_blue h4{ background-color:#69C769;}

.intro{ margin-bottom:20px;padding:20px; font-weight:bold; color:#FFF; text-align:center; line-height:140%; text-shadow:none;font-size: 13px; font-size: 1.3rem;background-color:#FD9BB9;     border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;  }

/* ---------- Box Corner ---------- */

div.ttl_style, div.ttl_style h4,
div.btn_style, div.btn_style a,
#eventlist ul li.name span,
#class_form div.submit, #class_form div.submit input,
#class_form div.form_btn,  #class_form div.form_btn input,
#class_form .form_area span.icon_required,
#class_form .box_privacy textarea {
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}

#class_ttl, 
#class_flow li div, #class_flow li div p,
#eventlist, #eventlist div.box_white,
#shokujubox, #shokujubox div.box_white,
.box_gray,
#detail div .detail,#detail div .detail div.image img,
.boder_red_2px,
#detail #event_infomation .bg_beige,
div.ttlbox_style h4,
#class_form .form_area.bg_beige, #class_form .form_area.bg_beige .box_white,
.baby_data {
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */ 
}


/* ---------- Border Color Style ---------- */


div.ttl_style, div.ttl_style h4,
div.btn_style, div.btn_style a { border-color:#FCBEBF;}

/* Red */
div.ttl_style.color_red, div.ttl_style.color_red h4,
div.btn_style.color_red, div.btn_style.color_red a,
#class_form div.submit.color_red, #class_form div.submit.color_red input { border-color:#FF827F;}

#class_form div.submit.color_red input{ /border-style:none;} /* for IE6-7 */


/* Dark Red */
div.ttl_style.color_darkred, div.ttl_style.color_darkred h4,
div.btn_style.color_darkred, div.btn_style.color_darkred a   {}

/* Brown */
div.ttl_style.color_brown, div.ttl_style.color_brown h4,
div.btn_style.color_brown, div.btn_style.color_brown a,
#class_form div.form_btn.color_brown, #class_form div.form_btn.color_brown input  { border-color:#B9A28C;}

/* Light Brown */
div.ttl_style.color_lightbrown, div.ttl_style.color_lightbrown h4,
div.btn_style.color_lightbrown, div.btn_style.color_lightbrown a   { border-color:#ECEADB; color:#595242; text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);}


/* ---------- Background Color Style ---------- */

/* Pink */
div.ttl_style h4,
div.btn_style a{
	background: #FAA5A7;
}

/* Red */
div.ttl_style.color_red h4,
div.btn_style.color_red a,
#class_form div.submit.color_red input {
	background: url(../img/dot_white.png) repeat #FF4D48;
	background: url(../img/dot_white.png) repeat, rgb(255,77,72); /* Old browsers */
	background: url(../img/dot_white.png) repeat, -moz-linear-gradient(top,  rgb(255,77,72) 0%, rgb(255,35,30) 100%); /* FF3.6+ */
	background: url(../img/dot_white.png) repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,77,72)), color-stop(100%,rgb(255,35,30))); /* Chrome,Safari4+ */
	background: url(../img/dot_white.png) repeat, -webkit-linear-gradient(top,  rgb(255,77,72) 0%,rgb(255,35,30) 100%); /* Chrome10+,Safari5.1+ */
	background: url(../img/dot_white.png) repeat, -o-linear-gradient(top,  rgb(255,77,72) 0%,rgb(255,35,30) 100%); /* Opera 11.10+ */
	background: url(../img/dot_white.png) repeat, -ms-linear-gradient(top,  rgb(255,77,72) 0%,rgb(255,35,30) 100%); /* IE10+ */
	background: url(../img/dot_white.png) repeat, linear-gradient(to bottom,  rgb(255,77,72) 0%,rgb(255,35,30) 100%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff4d48', endColorstr='#ff231e',GradientType=0 );*/ /* IE6-9 */
}

/* Dark Red */
div.ttl_style.color_darkred h4,
div.btn_style.color_darkred a{
	background: #D90000;
}

/* Brown */
div.ttl_style.color_brown h4,
div.btn_style.color_brown a,
#class_form div.form_btn.color_brown input{
	background: url(../img/renew/dot_white.png) repeat #856A4E;
	background: url(../img/renew/dot_white.png) repeat, rgb(155,123,91); /* Old browsers */
	background: url(../img/renew/dot_white.png) repeat, -moz-linear-gradient(top,  rgb(155,123,91) 0%, rgb(133,106,78) 100%); /* FF3.6+ */
	background: url(../img/renew/dot_white.png) repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(155,123,91)), color-stop(100%,rgb(133,106,78))); /* Chrome,Safari4+ */
	background: url(../img/renew/dot_white.png) repeat, -webkit-linear-gradient(top,  rgb(155,123,91) 0%,rgb(133,106,78) 100%); /* Chrome10+,Safari5.1+ */
	background: url(../img/renew/dot_white.png) repeat, -o-linear-gradient(top,  rgb(155,123,91) 0%,rgb(133,106,78) 100%); /* Opera 11.10+ */
	background: url(../img/renew/dot_white.png) repeat, -ms-linear-gradient(top,  rgb(155,123,91) 0%,rgb(133,106,78) 100%); /* IE10+ */
	background: url(../img/renew/dot_white.png) repeat, linear-gradient(to bottom,  rgb(155,123,91) 0%,rgb(133,106,78) 100%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9b7b5b', endColorstr='#856a4e',GradientType=0 );*/ /* IE6-9 */
}

/* Light Brown */
div.ttl_style.color_lightbrown h4,
div.btn_style.color_lightbrown a{
	background: #F3F2E4;
}


/* ---------- Title Style ---------- */

div.ttl_style { margin-bottom:15px;}
div.ttl_style h4 { padding:10px;}
div.ttl_style h4 { font-size: 14px;} /* =14px */


/* ---------- Button Icon Style ---------- */

#mainArea-2nd div.btn_style a,
#mainArea-2nd div.btn_style a:link,
#mainArea-2nd div.btn_style a:visited,
#mainArea-2nd div.btn_style a:hover { color:#FFF;}

div.btn_style a {position:relative; padding:5px 20px 5px 5px; display:block;}
div.btn_style a:after {
    display: block;
    content: " ";
    position: absolute;
	top: 50%;
	right:10px;
    width: 4px;
    height: 6px;
	margin-top: -3px;
    background: url(../img/btn_icon01.gif) no-repeat;
}

div.btn_style a.icon_mail {padding:5px 5px 5px 30px;}
div.btn_style a.icon_mail:after { display:none;}
div.btn_style a.icon_mail:before {
	display: block;
    content: " ";
    position: absolute;
	top: 50%;
	left:10px;
    width: 14px;
    height: 10px;
	margin-top: -5px;
    background: url(../img/btn_icon02.gif) no-repeat;
}

div.btn_style a { /padding:5px 10px 5px 5px;} /* for IE6-7 */
div.btn_style a span { /background: url(../img/renew/btn_icon01.gif) no-repeat right center; /padding-right:10px;} /* for IE6-7 */
div.btn_style a.icon_mail { /padding:5px 5px 5px 10px;} /* for IE6-7 */
div.btn_style a.icon_mail span { /background: url(../img/renew/btn_icon02.gif) no-repeat left center; /padding-left:20px;} /* for IE6-7 */


/* ---------- Submit Button Style ---------- */

#class_form div.submit,
#class_form div.form_btn { width:300px; margin:0 auto 40px;}
#class_form div.submit input,
#class_form div.form_btn input  { width:298px; padding:10px 0; cursor:pointer;}
#class_form div.submit input,
#class_form div.form_btn input { font-size: 14px; font-size: 1.4rem;} 


/* ---------- Box Style ---------- */

.class_box_style01 { padding:15px 0; text-align:center;}
.class_box_style01 p { text-align:center; margin-bottom:10px;}
.class_box_style02 { padding:15px 0;}
.class_box_style02 h3 { margin-bottom:10px;}



/* ---------- Global Class ---------- */


.bold { font-weight:bold;}

/* Color */
.blue { color:#1DACE5;}
.pink { color:#E55192;}
.pink02 { color:#F88BAA;}
.purple { color:#4C3F97;}
.red { color:#D90000;}
.lightgreen { color:#8DC41E;}

/* Background Color */
.bg_beige{ background-color:#F7F7F7;}

/* Box Style */
.box_white { background-color:#FFF;}
.box_gray  { background-color:#FAFAFA; border:1px solid #DDD;}

.border_dot_bottom { border-bottom:1px dotted #DDDDDD;}

.boder_red_2px{ border:2px solid #D90000;}



/* Float */
#mainArea-2nd .left  { float:left;}
#mainArea-2nd .right { float:right;}


/* ---------- PC Only ---------- */
.pc_break { display:block;}
.sp_break { display:inline;}

/* ---------- SP Only ---------- */
.sp_only{ display:none;}
.pc_only{ display:inline;}



/* ///////////////////////////////////////////////////////////////////////////////////////

 Index

/////////////////////////////////////////////////////////////////////////////////////// */


/* Contact */
#class_contact { padding:15px 0; text-align:center;}
#class_contact p { text-align:center; margin-bottom:10px;}
#class_contact p.f14 { font-weight:bold;}
#class_contact div.btn_style { display:inline-block; margin-bottom:10px;}

#class_contact div.btn_style { /display:inline;} /* for IE6-7 */




/* shokuju */
#shokujubox { padding:10px; margin-bottom:20px;}
#shokujubox p { padding: 30px 15px; text-align:center; vertical-align:middle; color:#62B95E; font-weight:bold; font-size:16px; font-size:1.6rem;}
#shokujubox p strong{ display:block; margin-bottom:10px; }



/* ///////////////////////////////////////////////////////////////////////////////////////

 Lesson

/////////////////////////////////////////////////////////////////////////////////////// */


/* ///////////////////////////////////////////////////////////////////////////////////////

 E-mail / Application /Contact

/////////////////////////////////////////////////////////////////////////////////////// */

#class_form .form_area.bg_beige { padding:10px; margin-bottom:40px;}
#class_form .form_area.bg_beige .box_white { padding:20px;}

#class_form .form_area span { vertical-align:middle;}
#class_form .textfield { padding:3px;}
#class_form .form_area input,
#class_form .form_area select { vertical-align:middle; margin:5px;}
#class_form .form_area textarea { border-color:#CCC; height:10em; line-height:140%; margin:5px;}


/* Border Doted */
#detail.border_dot_bottom { padding-bottom:10px;}
#event_maintitle.border_dot_bottom { padding-bottom:30px;}


/* E-mail */
#class_form .form_area.bg_beige .box_white .list_mail { text-align:center;}
#class_form .form_area.bg_beige .box_white .list_mail span { padding-right:10px;}
#class_form .form_area.bg_beige .box_white .list_mail input.textfield { width:40%;}
#class_form .form_area.bg_beige .box_white .list_mail p.f10 { text-align:center; line-height:140%;}

/* Complete Message */
.class_message{ margin-bottom:20px;}
#pgcm .class_message h3 { margin:5px 0; font-size: 16px; font-size: 1.6rem; font-weight: bold; line-height:160%; padding:0 20px;}
.class_message p { text-align:center; margin-bottom:30px; line-height:160%; padding:0 10px;}
.class_message p.f16 { margin-bottom:20px; line-height:140%; font-size:16px;}
.class_message p.al-left {text-align: left;}
.class_message .btn_set01 { text-align:center;}

.class_message .btn_set01 .btn_style,
.class_message .btn_set01 .btn_style a{ display:inline-block;}
.class_message .btn_set01 .btn_style a{ padding: 10px 25px 10px 0; width:auto; text-align:center;}
.class_message .btn_set01 .btn_style a{ font-size: 14px; font-size: 1.4rem;} /* =18px */

.class_message .btn_set01 .btn_style { /display:inline;} /* for IE6-7 */



/* Question */
#class_form .form_area .list_item { border-bottom:1px solid #EEE; padding-bottom:10px; margin-bottom:10px}
#class_form .form_area .list_item:last-child { border-bottom:none; padding-bottom:0px; margin-bottom:0;}

#class_form .form_area .list_item .left  { width:12%;}
#class_form .form_area .list_item .right { width:88%;}

#class_form .form_area .list_inquiry .left  { width:20%;}
#class_form .form_area .list_inquiry .right { width:80%;}

#class_form .form_area .list_contact .left  { width:22%;}
#class_form .form_area .list_contact .right { width:78%;}

#class_form .form_area .list_item .left,
#class_form .form_area .list_item .right { text-align:left;}

#class_form .form_area .list_item .w10  { width:10%;}
#class_form .form_area .list_item .w20  { width:20%;}
#class_form .form_area .list_item .w30  { width:30%;}
#class_form .form_area .list_item .w40  { width:40%;}
#class_form .form_area .list_item .w50  { width:50%;}
#class_form .form_area .list_item .w60  { width:60%;}
#class_form .form_area .list_item .w70  { width:70%;}
#class_form .form_area .list_item .w80  { width:80%;}
#class_form .form_area .list_item .w90  { width:90%;}
#class_form .form_area .list_item .w100 { width:100%;}

#class_form .form_area .list_item .left span { font-weight:bold; }

#class_form .form_area .list_item .left span.f14 { display:block;}

#class_form .form_area span.f30,
#class_form .form_area span.f18 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; vertical-align:text-bottom; padding-right:5px; line-height:120%;}

#class_form .form_area span.f30 { font-size: 20px; font-size: 2.0rem;} /* =30px */
#class_form .form_area span.f18 { font-size: 12px; font-size: 1.2rem;} /* =18px */

#class_form .form_area span.icon_required { display:inline-block; color:#FFF !important; padding:1px 12px; margin-top:5px; text-align:center; text-shadow:none;}
#class_form .form_area .list_inquiry span.icon_required { display:block; width: 4em;}
#class_form .form_area .list_item .right p { margin:5px 0; line-height:140%;}
#class_form .form_area .list_item .right span { padding-right:5px;}


#class_form .form_area .list_question .left span,
#class_form .form_area .list_inquiry .left span,
#class_form .form_area .list_contact .left span { color:#F88BAA;}
#class_form .form_area .list_user .left span { color:#62B95E;}

#class_form .form_area .list_question span.icon_required,
#class_form .form_area .list_inquiry span.icon_required,
#class_form .form_area .list_contact span.icon_required  { background-color:#F88BAA;}
#class_form .form_area .list_user span.icon_required     { background-color:#62B95E;}

#class_form .box_privacy textarea { width:97%; margin-top:-10px; margin-bottom:20px; border:1px solid #DDD; background-color:#FAFAFA; padding:1%; height:150px;}

#class_form h5 { margin-bottom:20px; padding-bottom: 10px; border-bottom: 1px solid #EEE;color: #62B95E; line-height:140%; font-size:16px; font-size: 1.6rem; font-weight: bold;}
#class_form .form_area h5 span.icon_required { margin-right: .5em; font-size: 12px; font-size: 1rem; line-height: 1.4em; background-color:#62B95E;}

#class_form .form_area .list_user .optional { display: inline-block; margin: 5px 0; padding: 5px; border: 1px solid #DDD; background: #FAFAFA;}

/* Contact */
#class_form #form_confirm .list_item span.icon_required { display:none;}
#class_form #form_confirm .list_item .right { line-height:160%;}

#class_form .submit_2col { width:624px; margin:0 auto;} 
#class_form .submit_2col .submit { float:left;} 
#class_form .submit_2col .form_btn { float:right;} 

.finished{ margin: 0 0 20px;
color: #FFF;
font-weight: bold;
text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.1);
background:#D90000;border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;padding: 10px;font-size: 14px;}


.baby_data {
  margin: 20px 0;
  padding: 20px;
  border: solid 1px #62B95E;
}
.baby_add { text-align: center; }
.baby_del { text-align: right; }

.toiawaseinfo {
    font-size: 0.9em;
    padding: 1em 2em;
    width: 80%;
    margin: 0 auto;
    border: none;
}

#pgcm .toiawaseinfo p {
    margin: 5px 0 5px 1em;
    text-indent: -1em;
}


/* ///////////////////////////////////////////////////////////////////////////////////////

 For Smart Phone

/////////////////////////////////////////////////////////////////////////////////////// */


.ui-body-c #mainArea-2nd,
.ui-dialog.ui-overlay-c #mainArea-2nd{ text-shadow:none;}


@media screen and (max-width: 700px) {

/*
html, body,
#wrapper,	
#mainArea-2nd { width:100%;}*/

/* ---------- PC Only ---------- */
.pc_break { display:inline;}
.sp_break { display:block;}

/* ---------- SP Only ---------- */
.sp_only{ display:inline;}
.pc_only{ display:none;}

/* ---------- H4 Title & Button Style ----------  */

div.ttl_style { border-left:none; border-right:none; margin-bottom:0;}

div.ttl_style h4 { margin-left:0px; margin-right:0; border-left:none; border-right:none;}

div.ttlbox_style { margin-bottom:10px;}
div.ttlbox_style h4 { padding:10px; text-align:left; line-height:140%;}
div.ttlbox_style h4 { font-size: 14px; font-size: 1.4rem; } /* =14px */




/* ---------- Box Corner ---------- */

div.ttl_style, div.ttl_style h4
/*div.btn_style, div.btn_style a*/ {
    border-radius: 0px;        /* CSS3草案 */  
    -webkit-border-radius: 0px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 0px;   /* Firefox用 */  
}

#class_ttl, 
/*#class_flow li div, #class_flow li div p,*/
#eventlist, #eventlist div.box_white,
.box_gray,
#detail div .detail,
#detail #event_infomation .bg_beige,
div.ttlbox_style h4,
#class_form .form_area.bg_beige, #class_form .form_area.bg_beige .box_white  {
    border-radius: 0px;        /* CSS3草案 */  
    -webkit-border-radius: 0px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 0px;   /* Firefox用 */ 
}

#eventlist ul,
#detail div .detail.boder_red_2px,
.class_message .class_box_style01 {
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */  
}

#class_contact.box_gray{ border-left:0px; border-right:0px;}


/* ---------- Button Icon Style ---------- */

div.btn_style a { padding:10px 20px 10px 10px;}
div.btn_style a.icon_mail {padding:10px 10px 10px 30px;}

div.btn_style a:link, div.btn_style a:hover, div.btn_style a:visited{ color:#FFF !important;}

/* ---------- Submit Button Style ---------- */

#class_form div.submit,
#class_form div.form_btn { width:300px; margin:0 auto 20px;}


/* ///////////////////////////////////////////////

 Index

/////////////////////////////////////////////// */

/* Main Title */
#class h2 { padding:15px; background-size:auto 100%;}


#class_ttl { padding:10px 5px;}
#class_ttl div { width:16%; padding-top:15px; text-align:center;}
#class_ttl div img{ width:45px; height:auto;}
#class_ttl p { width:82%; margin:5px 0 0 2%; line-height:130%; text-align:left; font-weight:bold;}
#class_ttl p { font-size: 13px; font-size: 1.3rem; } /* =13px */

.mg_bottom15{ margin-bottom:10px !important;}
.mg_bottom20{ margin-bottom:10px !important;}

/* Flow */
#class_flow { padding:0 10px;}
#class_flow li p { font-size: 12px; font-size: 1.2rem; } /* =16px */
#class_flow li p span { margin-bottom:0px;}

/* Event List */

#eventlist .box_white { background-color:transparent;}
#eventlist ul#list_item { display:none;}
#eventlist ul { margin-bottom:10px; padding:15px 0 15 px 15px; border-bottom:none; list-style:none; display:block; width:100%; background-color:#FFF;}
#eventlist ul:last-child{ margin-bottom:0;}
#eventlist ul li{ border-right:none; display:block; text-align:center; vertical-align:top; height:auto; float:left;}
#eventlist ul li p { text-align:left;}
#eventlist ul li.info,
#eventlist ul li.link { width:66%;}

#eventlist ul li.info { margin-bottom:5px;}

#eventlist ul li.info img { display:none;}

#eventlist ul li.link div.btn_style { margin:5px 10px 0 0; display:block;}
#eventlist ul li.link span.end { padding-left:0px; display:block; margin-top:5px;}

#eventlist ul li.link,
#eventlist ul li.link p { text-align:left;}

#eventlist ul li.link p { margin-left:0px;}


/* Event Report */
#class_report li { width:auto; float:none; text-align:center; margin:0 10px 20px 10px;}
#class_report li img { width:100%; height:auto; max-width:320px;}

/* Kyosai&Banar */
#class_kyosai { margin-top:-5px;}
#class_kyosai li { width:140px; float:left; margin:0 5px 10px 5px;}
#class_kyosai li a{ display:block;}
#class_kyosai li img { width:138px; height:auto;}

#class_banar { width:100%; margin:0 0 10px; text-align:center;}
#class_banar a { margin:0 5px 10px 5px; display:block;}



#event_maintitle div.event_title { float:left;}

#event_maintitle div.event_info { float:right;}

#event_maintitle div.event_icon  { width:25%; text-align:center;}
#event_maintitle div.event_info  { width:15%;}
#event_maintitle div.event_title { width:60%; text-align:center;}


/* ///////////////////////////////////////////////

 Lesson

/////////////////////////////////////////////// */

#event_logo { margin-top:10px;}

/* Event Title */
#event_maintitle div.event_title { float:none; clear:both;}

#event_maintitle div.event_icon  { width:50%;}
#event_maintitle div.event_info  { width:50%;}
#event_maintitle div.event_title { width:auto; margin:0; padding-top:10px;}
#event_maintitle div.event_title p { margin:0 10px; text-align:left;}


/* Event Detail */
#detail div.column2,
#detail div.column1 {width:100%;}
#detail .detail .image { float:none; width:160px; margin:0 auto 10px;}
#detail p.sub_text,
#detail #present_item p {margin:0 10px;}


#detail #present_item ul li { width:80px; padding:4px; float:left; margin:8px; border:1px solid #DDD;}
#detail #present_item ul li a { border:none;}
#detail #present_item ul li img{ width:80px; height:auto;  margin:0px;}

#detail #present_item ul li p{ display:none;}

#detail #event_infomation .detail { padding:10px;}
#detail #event_infomation #map_info p { margin-bottom:20px;}
#detail #event_infomation #map_info .left { width:100%;}
#detail #event_infomation #map_info .left,
#detail #event_infomation #map_info .right { float:none; clear:both;}
#detail #event_infomation .detail.boder_red_2px { margin:-10px 10px 10px;}
#detail #event_infomation #map_info .btn_style a { text-align:center;}
#detail #event_infomation .bg_beige { padding:20px 10px;}
#detail #event_infomation #btn_application.btn_style,
#detail #event_infomation #btn_application.btn_style a{ display:block;}
#detail #event_infomation #btn_application.btn_style a{ padding: 10px 0; width:auto; text-align:center;}


/* ///////////////////////////////////////////////

 E-mail / Application /Conyact

/////////////////////////////////////////////// */

#class_form .form_area.bg_beige { padding:10px 0;}
#class_form .form_area.bg_beige .box_white { padding:10px;}

/* Border Doted */
#detail.border_dot_bottom { padding-bottom:0px;}
#event_maintitle.border_dot_bottom { padding-bottom:20px;}

/* E-mail */
#class_form .form_area.bg_beige .box_white .list_mail { text-align:left;}
#class_form .form_area.bg_beige .box_white .list_mail span { display:block; margin-bottom:10px;}
#class_form .form_area.bg_beige .box_white .list_mail input.textfield { width:auto;}
#class_form .form_area.bg_beige .box_white .list_mail p.f10 { text-align:left;}

/* Complete Message */
.class_message p { margin-bottom:20px; text-align:left;}
.class_message p.f16 { margin-bottom:10px;}

.class_message .btn_set01 .btn_style{ width:auto; margin:0 10px;}
.class_message .btn_set01 .btn_style,
.class_message .btn_set01 .btn_style a{ display:block;}
.class_message .btn_set01 .btn_style a{ width:auto;}

/* Application */
.class_message .class_box_style01 { margin:0 10px;}
.class_message .class_box_style01 p { text-align:center;}
.class_message .class_box_style01 .sp_break { font-size: 12px; font-size: 1.2rem;} /* =12px */
.class_message .class_box_style02 { margin:0 10px;}
.class_message .class_box_style02 h3 { }

/* Question */
#class_form .form_area .list_item .left  { width:100%; float:none;}
#class_form .form_area .list_item .right { width:100%; float:none;}
#class_form .form_area .list_item span.icon_required { display:inline-block; color:#FFF; padding:1px 12px; margin-top:-4px; margin-left:5px; text-align:center;}
#class_form .form_area .list_item .left span.f14 { display:inline-block;}


#class_form .box_privacy { width:auto; margin:0 10px;}
#class_form .box_privacy textarea { margin-bottom:0;}

#class_form .textfield { min-width: 20%;}
.spw40 { width:40% !important;}
.spw100 { width:95% !important;}

#class_form .submit_2col { width:100%; margin:0 auto;} 
#class_form .submit_2col .submit,
#class_form .submit_2col .form_btn { float:none; margin-top:10px;} 

.toiawaseinfo {width: 94%;}


}

@media screen and (max-width: 560px) {
#class h2 { padding:10px; background:none;}
#class h2 img{ width:90%;}
#eventlist ul li.figure{ text-align:center; margin-bottom:15px;}

#eventlist ul li.figure,
#eventlist ul li.info,
#eventlist ul li.link { width:100%; border:none; padding-right:0;}

#eventlist ul li.figure img{ margin:0 auto;}
#eventlist ul li.link div.btn_style{margin: 5px 0 0 0;}

}

@media screen and (max-width: 508px) {

/* Kyosai&Banar */
#class_banar a { width:100%; margin:0 0 10px 0; text-align:center; display:block;}


}

@media screen and (max-width: 400px) {

/* Flow */
#class_flow li.bg_blue,
#class_flow li.bg_pink { background-position:98% center;}


}


@media screen and (max-width: 310px) {

/* ---------- Submit Button Style ---------- */

#class_form div.submit,
#class_form div.form_btn { width:230px;}
#class_form div.submit input,
#class_form div.form_btn input { width:228px;}


}

/* contact navi */
#pgcm .contact_navi .contact_navi_item {
    display: block;
    border-radius: 10px;
    width: 40%;
    margin: 10px 4%;
    padding: 20px 40px 0;
    text-align: center;
}

#pgcm .contact_navi .contact_navi_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

#pgcm .contact_navi .contact_navi_item h2 {
    font-size: 1.5em;
    font-weight: bold;
    line-height: 1.4;
}

#pgcm .contact_navi_item a {
    display: block;
    padding: 4px 10px;
    border-radius: 10px;
    background-color: #6699cc;
    color: #fff;
    margin: 10px auto;
    position: relative;
    transition: all .5s;
}

#pgcm .contact_navi .contact_navi_item h3 {
    margin: 20px auto;
    line-height: 1.1;
}

#pgcm .contact_navi_item a::after {
    content: '';
    width: 6px;
    height: 6px;
    border: 0;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -4px;
    transform: rotate(45deg);
}

#pgcm .contact_navi_item a:hover{
    opacity: .7;
}

#pgcm .contact_navi .contact_navi_item.-pginfo {
    background-color: #badaf3;
}

#pgcm .contact_navi .contact_navi_item.-pgsp {
    background-color: #f5d4d4;
}

#pgcm .contact_navi .contact_navi_item.-pginfo h3 {
    line-height: 2.2;
}
#pgcm .contact_navi .contact_navi_item .contact_navi_description {
    margin: 10px 0;
}
#pgcm .contact_navi .contact_navi_item.-pgsp .contact_navi_description {
    line-height: 2.2;
}

@media screen and (max-width: 700px) {
    #pgcm .contact_navi .contact_navi_item {
        width: 100%;
    }
    #pgcm .contact_navi .contact_navi_item h2 {
        font-size: 1.4em;
    }
    #pgcm .contact_navi .contact_navi_item {
        padding: 20px 10px 10px;
    }
    #pgcm .contact_navi .contact_navi_item.-pgsp .contact_navi_description {
        line-height: 1.6;
    }
}