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

body { min-width:100%; font-size:100%;}
#header {}
#content {}
#footer {}

#wrapper {}
#base {}

.pc { display:none;}
.sm { display:block;}
	
.large { font-size: 120%;}


/*====================================================================================================
  HEADER
====================================================================================================*/
#header {}

/*====================================================================================================
  CONTENT
====================================================================================================*/
#content {}
#content ul.link_bana { position:static; width: 100%; overflow: hidden;}
#content ul.link_bana li { width:50%;}
#content ul.link_bana li+li { margin-left:0;}
#content ul.link_bana li a {
	display: block;
	width:100%;
	height:auto;
	padding:10px 10px 10px 70px;
	font-size:100%;
	text-align: left;
	line-height: 130%;
	border-radius:0; /* CSS3 */
	-webkit-border-radius:0; /* Safari,Google Chrome */
	-moz-border-radius:0;/* Firefox */
}
#content ul.link_bana li:nth-child(1) a { background:#FF7300 url("../../img/linkbtn01.png") no-repeat 20px center; background-size: 40px auto;}
#content ul.link_bana li:nth-child(2) a { background:#E5400A url("../../img/linkbtn02.png") no-repeat 20px center; background-size: 40px auto;}

/* COURSE LIST */
#content .flow { position: relative; margin:10% 0; width:100%; background:none;}	
#content .flow::before {
	display: block; clear: both; content:"";
	position: absolute; top: 0; left: 20px;
	width: 3px;
	height:100%;
	background:#ccc;
}	
#content .flow div { position: relative; float: none; margin: 0 !important; width: 100% !important; z-index: 999;}
#content .flow .mid { font-size:100%;}
#content .flow .step { position: relative; margin-left:40px; text-align:left; font-size:100%;}
#content .flow .step::before {
	display: block; clear: both; content:"";
	position: absolute; top:15px; left:-26px;
	width:15px;
	height:15px;
	background:#ccc;
	border-radius:15px; /* CSS3 */
	-webkit-border-radius:15px; /* Safari,Google Chrome */
	-moz-border-radius:15px;/* Firefox */
}	
#content .flow ul { margin-top:5%; margin-left:40px; padding: 0 0 5%; overflow: inherit;}
#content .flow ul li { float: none !important; width: 100% !important;}
#content .flow ul li .step { margin-left:0;}
#content .flow ul li+li {  margin-top:10px;}
#content .flow ul li a { 
	position: relative;
	display: block;
	max-width:inherit !important;
	width: 100% !important;
    min-height: 60px;
	text-align:left;
	padding:10px 10px 10px 70px;
    background: #f6f6f6;
	border-radius:10px; /* CSS3 */
	-webkit-border-radius:10px; /* Safari,Google Chrome */
	-moz-border-radius:10px;/* Firefox */
	box-sizing: border-box;
}
#content .flow ul li a::before { position: absolute; top:5px; left:10px; background-size: 40px !important;}
#content .flow ul li a b {font-size:100%;}
#content .flow ul li small { display:block;}
#content .flow .cate1 ul li small  { background: #91BC1B; }
#content .flow .cate2 ul li small  { background: #559414; }
#content .flow .cate3 ul li small  { background: #B56B00; }
#content .flow .cate4 ul li small { background: #FFB60F; }
#content .flow .cate4 ul li a { padding-top:20px;}
    
#content .flow .cate3 ul li:nth-child(2) a::before { display:block;background: url("../../img/icon_07.png") no-repeat center center;}
#content .flow .cate3 ul li:nth-child(2) a { color:#da9107; padding-top: 20px;}
#content .flow .cate3 ul li:nth-child(2) small { background: #da9107; }
    
#subpage .flow { margin:10% auto; width:96%;}	
#subpage .flow ul li a { background: #ffff;}
#content .notes p { padding-left: 25px; text-indent:-20px;}

/*====================================================================================================
  FOOTER
====================================================================================================*/
#footer {}
#footer ul { margin:0 auto; padding:20px 0; width:90%;}
#footer ul li {
	float:left;
	margin:0 !important;
	padding:10px;
	width:50%;
	overflow:hidden;
}
    #footer ul li:nth-child(2n+1) { clear: both;}
#footer ul li img { width:100%; height:auto;}
#footer .copy { font-size:90%;}


/*====================================================================================================
  TOPPAGE
====================================================================================================*/
#toppage {}
	
/* NEWS */
#news { padding:10% 2% 0;}
#news ul li:nth-child(1),
#news ul li:nth-child(2) { float:none; width:100%;}
#news ul+ul { border-top: 1px solid #DDD;}
#news .b_more { float:none; margin:5% auto;}
	
/* MIRYOKU */
#miryoku { padding:10% 2% 0;}
#miryoku .box1 .photo,
#miryoku .box1 .come { float:none; width: 100%;}
#miryoku .box1 img { width:100%; height: auto;}
#miryoku .box1+.box1,
#miryoku .movie+.box1 { margin:10% 0 0;}
#miryoku .box2 { float:none; margin:10% 0 0; width:100%;}
#miryoku .box2+.box2 { margin:10% 0 0;}
#miryoku .box2 img { width:100%; height: auto;}
	

/*** ABOUT *****************************************************************/
#about { position:relative; padding:10% 2%;}
#about:after { display:none;}
#about h2 {
	margin-bottom: 5%;
	height:70px;
	background:url(../../img/catch_sm.png) no-repeat center top;
}
#about .come { margin-bottom:10px; padding:0; text-align:left;}
#about .chart { padding-bottom:50px; padding:0 20px; width:100%; height:auto;}
#about .chart b {
	position:static !important;
	margin-bottom:10px;
	padding:10px !important;
	width:100% !important;
	height:auto !important;
	line-height:130%;
	border-radius:10px; /* CSS3 */
	-webkit-border-radius:10px; /* Safari,Google Chrome */
	-moz-border-radius:10px;/* Firefox */
}
#about .chart b br { display:none;}
#about .chart_flow {
	width:100%;
	height:160px;
	text-indent:-9999px;
	background:url(../../img/chart_flow.png) no-repeat center center;
	background-size:auto 160px;
}

#toppage .course_list { padding:10% 2%;}
#toppage ul.panel { display: none;}


/*====================================================================================================
  SUBPAGE
====================================================================================================*/
#subpage { margin:0;}

#subpage ul.link_bana { top:-80px;	max-width: 1000px;}
#subpage ul.link_bana li { width:100%;}
#subpage ul.link_bana li a { padding: 20px 10px 20px 70px;}
#subpage ul.link_bana li br { display: none;}

/* PAN */
.pan { display: none;}

#subpage .school_box,
#subpage .entry { margin:5% 2%; width:auto;}
#subpage .school_box { padding:5%;}
#subpage .entry { padding:5%;}

/* SCHOOL =========================================================================================*/

/* PAGE TITLE */
#subpage h2 small { font-size:130%; margin-bottom:5px;}
#subpage h2 b { font-size:150%; margin-bottom:5px;}

/* MISASHI */
#subpage h3 { font-size:150%; }

/* MAIN COME */
#subpage .main_come p { float:none; margin-left:0; text-align: center;}

/* ENTRY BTN */
#subpage .btn_entry { margin:10% auto; max-width: 385px;}

/* POINT */
#subpage dl.point { margin:10% auto 0;}
#subpage dl.point dd p { float:none; margin-right:0; width:100%; }

/* GAIYOU  */
#subpage .gaiyou { margin:10% auto 0;}
#subpage .gaiyou dl { float:none; width:100%;}
#subpage .gaiyou dl+dl { margin-left:0;}
#subpage .gaiyou dl.attention dd { padding:5%;}

/* SCHEDULE */
#subpage .schedule { margin:10% auto;}
#subpage .schedule h4 { padding:1% 0 4%; font-size:130%;}
#subpage .schedule dl { float: none !important; margin:2%; width:auto !important;}
#subpage .schedule dt:has(.notes) span { top: 10px; bottom: inherit;}
#subpage .schedule dt .notes { display: block; font-size: 10px; margin: 10px 0 0 !important;}
#subpage .schedule dd .day2 li { float:none; font-size: 110%;}
#subpage .schedule dd .day2 li:nth-child(1),
#subpage .schedule dd .day2 li:nth-child(2) { width:100%;}
#subpage .schedule.course1_sche dl dd .photo { float: none; width:100%; margin-left: 0;}
#subpage .schedule.course1_sche dl dd .come { width:100%;}


/* KAISAI */
#subpage .kaisai { position:relative; margin:10% auto 0;}
#subpage .kaisai h3:before {
	position:absolute; left: 0; top:-70px;
	width:80px; height:60px;
	background-size:100% auto;
}

/* VOICE  */
#subpage .voice { margin:10% auto 0;}
#subpage .voice p { margin:5% 2%;}

/* KAIGYOU */
#subpage p.indention { height:20px;}

/* DOWNLOAD */
#subpage .download p { float:none; width:100%;}
    
/* オンデマンド用 */
#subpage dl.free { margin:10% auto; }
#subpage dl.free.ondemand_entry dd { flex-direction:column; gap:20px;}
#subpage dl.free.ondemand_entry dd p:nth-child(1),
#subpage dl.free.ondemand_entry dd p:nth-child(2) { width: 100%;}
#subpage dl.free dt { width: 100%; box-sizing: border-box;}
#subpage dl.free dd .zu {
    padding:10px;
}
#subpage dl.free dd table.center { text-align:left !important;}
#subpage dl.free dd table th,
#subpage dl.free dd table td {
    table-layout:auto !important;
    display:block !important;
    padding:10px 15px;
    width:auto;
    width: 100%;
    text-align:left !important;
    box-sizing: border-box;
}
#subpage dl.free dd table tr th:last-child,
#subpage dl.free dd table tr td:last-child { padding:0 15px 10px !important;}
#subpage dl.free dd table span { display: inline;}
#subpage dl.free dd table tr th:nth-child(2),
#subpage dl.free dd table tr td:nth-child(2) { display: none !important;}
    
	
	
/*** ENTRY *****************************************************************/
.entry {
	position:relative;
	margin:20px auto;
	padding:20px;
	width:100%;
	border:none;
	border-bottom:none;
	background:#FFF;
	border-radius:10px; /* CSS3 */
	-webkit-border-radius:10px; /* Safari,Google Chrome */
	-moz-border-radius:10px;/* Firefox */
}
.entry:before,
.entry:after { display: none;}
.entry h4 { font-size:130%;}
.entry h5 { font-size:100%;}

    
.entry table.mail { margin:20px auto 0; padding:0; width:auto; border:none;}
.entry table.mail th,
.entry table.mail td {
	table-layout:auto !important;
	display:block !important;
	width:auto !important;
	height:auto !important;
	text-align:center;
	font-weight:normal;
	border:none;
}
.entry table.mail th { padding:5px 0 !important;}
.entry table.mail td { padding:15px 0 !important;}
.entry table.mail td input[type=text],
.entry table.mail td textarea {
	width:100% !important;
	padding:5px;
	box-sizing:border-box;
}
.entry table.mail td label {
	display:block !important;
	float:none !important;
	width:100% !important;
	text-align:left;
	padding:5px;
	border:1px solid #DDD;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	box-sizing:border-box;
	background:#FCFCFC;
}
.entry table.mail td input.yubin { width:50% !important; margin-bottom:5px;}
.entry table.mail td ul.col2 { width:100%; text-align: left;}
.entry table.mail td ul.col2 li { float:none; margin-right:0; text-align:left; width:100%;}
.entry table.mail td br + ul.col2 li,
.entry table.mail td ul.col2 li + li,
.entry table.mail td p + p,
.entry table.mail td label+label  {  margin-top:5px !important;}
.entry table.mail td ul.table_set li.check_main span  { display: block; text-indent: 20px;}
.entry table.mail td ul.table_set li.check_sub label  { max-width:100%;}
.entry table.mail td ul.table_set li.check_sub label+label  { margin-left: 0;}

.btn, .btn_entry2, .btn_entry3 , .btn_entry4 { margin:2% auto;  font-size: 90%; width:auto;}

}