@media print, screen and (max-width: 768px){

/*
**  sp
============== ============== ============== ============== ============== ============== ============== */
	
/*///////// 講座一覧トップ //////////*/
.cgarea a:hover .cg01 {
	border: solid 2px #499bee;
	background-color: #499bee;
	color: #fff;
	}
	
.cgarea a:hover .cg02 {
	border: solid 2px #f16482;
	background-color: #f16482;
	color: #fff;
	}
	
.cgarea a:hover .cg03 {
	border: solid 2px #b769c8;
	background-color: #b769c8;
	color: #fff;
	}
	
.cgarea a:hover .cg04 {
	border: solid 2px #ee8f49;
	background-color: #ee8f49;
	color: #fff;
	}
	
.cgarea a:hover .cg05 {
	border: solid 2px #62bf69;
	background-color: #62bf69;
	color: #fff;
	}
	
.cgarea a:hover .cgtt {
	color: #fff;
	}
	
.cgarea a:hover .cgboder {
	color: #fff;
	border-bottom: solid 2px #fff;
	}
	
.cgarea a:hover .cgtxt {
	color: #fff;
	}
	
.cg {
	margin: 0 0 3vh 0;
	text-align: center;
	padding:  3vh;
	}
	
.cg01 {border: solid 2px #499bee;}
.cg02 {border: solid 2px #f16482;}
.cg03 {border: solid 2px #b769c8;}
.cg04 {border: solid 2px #ee8f49;}
.cg05 {border: solid 2px #62bf69;}
	
.cgtt {font-size: 4.5vw;}
	
.cgtt01 {color: #499bee;}
.cgtt02 {color: #f16482;}
.cgtt03 {color: #b769c8;}
.cgtt04 {color: #ee8f49;}
.cgtt05 {color: #62bf69;}
	
.cgboder {
	width: 15vw;
	margin: 2vh auto;
	}
	
.cgbodercolor01 {border-bottom: solid 2px #499bee;}
.cgbodercolor02 {border-bottom: solid 2px #f16482;}
.cgbodercolor03 {border-bottom: solid 2px #b769c8;}
.cgbodercolor04 {border-bottom: solid 2px #ee8f49;}
.cgbodercolor05 {border-bottom: solid 2px #62bf69;}
	
.cgtxt {
	font-size: 3vw;
	line-height: 1.7em;
	color: #000
	}
	
.ptarea {
	clear: both;
	width: 100%;
	background-color: #f4f4f4;
	background-repeat: repeat;
	padding: 3vh 0;
	}
	
.ptBtn {
	width: 85vw;
	margin: 0 auto;
	}
	
	
/*///////// 分野トップ //////////*/
.bunyaback {
	padding: 2vh 0 4vh 5vw;
	margin-bottom: 5vh;
	}
.bunyabackcolor01{background-color: #ebf4fe; background-repeat: repeat;}
.bunyabackcolor02{background-color: #fef0f2; background-repeat: repeat;}
.bunyabackcolor03{background-color: #f0ebfe; background-repeat: repeat;}
.bunyabackcolor04{background-color: #fef8eb; background-repeat: repeat;}
.bunyabackcolor05{background-color: #ebfeec; background-repeat: repeat;}
	
.bunyatitle {
	width: 87vw;
	}
	
.bunyabox {
	font-size: 7vw;
	margin-top: 1vh;
	float: left;
	}
.bbcolor01 {color: #499bee;}
.bbcolor02 {color: #f16482;}
.bbcolor03 {color: #b769c8;}
.bbcolor04 {color: #ee8f49;}
.bbcolor05 {color: #62bf69;}
	
.bunyatitle h1 {
	font-size: 6.2vw;
	padding: 1vh 0 0.4vw 2vw;
	letter-spacing: 0.4vw;
	float: left;
	}
.bunyacolor01 h1 {color: #499bee;}
.bunyacolor02 h1 {color: #f16482;}
.bunyacolor03 h1 {color: #b769c8;}
.bunyacolor04 h1 {color: #ee8f49;}
.bunyacolor05 h1 {color: #62bf69;}	

.bunyatitle h1 span {
	font-size: 64%;
}

.subtitle { /** 長い副題がある場合 */
	display: block;
	font-size: 64%;
}

.bunyasab {
	clear: both;
	font-size: 3.5vw;
	line-height: 1.5em;
	width: 80vw;
	}
	
.koza-ichiran article:nth-child(odd) {
	text-align: center;
	margin-bottom: 5vh;
}

.koza-ichiran article:nth-child(even) {
	text-align: center;
	margin-bottom: 5vh;
	padding: 5vh 0 3vh 0;
	background-color: #f4f4f4;
}

/*.kozaarea01 {
	text-align: center;
	margin-bottom: 5vh;
	}
	
.kozaarea02 {
	text-align: center;
	margin-bottom: 5vh;
	padding: 5vh 0 3vh 0;
	background-color: #f4f4f4;
	background-repeat: repeat;
	}*/
	
.kzcolor01 {color: #499bee;}
.kzcolor02 {color: #f16482;}
.kzcolor03 {color: #b769c8;}
.kzcolor04 {color: #ee8f49;}
.kzcolor05 {color: #62bf69;}
	
.kztitle {
	display: flex;
	align-items: center;
	width: 70vw;
	margin: 0 auto 3vh auto;
	font-size: 5.3vw;
	letter-spacing: 5px;
	}
	
.kztitle:before,
.kztitle:after {
	border-top: 1px solid;
	content: "";
	flex-grow: 1;
	}
	
.kztitle:before {
	margin-right: 1rem;
	color: #000;
	}
	
.kztitle:after {
	margin-left: 1rem;
	color: #000;
	}

.kzarea {
	}

	
.kzarea ul li {
	margin-bottom: 2vh;
	}
	
	
.kzarea ul li a {
	border: solid 2px #499bee;
	width: 90vw;
	margin: 0 auto;
	padding: 2vh 0;
	border-radius: 3px 3px 3px 3px;
	vertical-align: middle;
	display: block;
	font-size: 3.5vw;
	color: #000;
	background-color: #fff;
	}
	
.kzbocolor01 ul li a {border: solid 2px #499bee;}
.kzbocolor01 ul li a:hover {background-color: #499bee;}

.kzbocolor02 ul li a {border: solid 2px #f16482;}
.kzbocolor02 ul li a:hover {background-color: #f16482;}
	
.kzbocolor03 ul li a {border: solid 2px #b769c8;}
.kzbocolor03 ul li a:hover {background-color: #b769c8;}

.kzbocolor04 ul li a {border: solid 2px #ee8f49;}
.kzbocolor04 ul li a:hover {background-color: #ee8f49;}
	
.kzbocolor05 ul li a {border: solid 2px #62bf69;}
.kzbocolor05 ul li a:hover {background-color: #62bf69;}
	
	
.kzarea ul li.kzlast02 {margin: 0 0 12vh 0;}	

	
	
/*///////// 講座詳細 //////////*/
	
.kzbox {
	font-size: 3.5vw;
	border: solid 1px #000;
	padding: 0.6vh 0;
	width: 35vw;
	text-align: center;
	margin: 1.5vh 0 1vh 10vw;
	}
	
.sabgengo {
	margin: 0 0 2vh 7.4vw;
	clear: both;
	}
	
.sabgengo li {
	width: 20vw;
	padding: 0.5vh 0;
	margin: 0.5vh 0 3vh 2.2vw;
	background-color: #3b3b3b;
	display: inline-block;
	text-align: center;
	color: #fff;
	font-size: 3vw;
	}

.datatitle {
	clear: both;
	font-size: 4.2vw;
	font-weight: bold;
	margin: 0 0 2vh 10vw;
	}

.detailssab {
	margin-left: 10vw;
	font-size: 3.5vw;
	line-height: 1.5em;
	}
	
.dtarea {
	width: 90vw;
	margin: 0 auto;
	}
	
.dttt {
	font-size: 4vw;
	font-weight: bold;
	border-bottom: solid 1px #c6c6c6;
	padding: 0 0 1vh 0;
	margin-bottom: 2.5vh;
	}
	
.dtlist li{
	font-size: 3.5vw;
	margin-bottom: 0.4vh;
	}
	
.dtlist02{
	list-style-type: square;
	margin: 0 0 3vh 8vw;
	}
	
.dtlist02 li{
	font-size: 3.5vw;
	margin: 0 0 0.7vh 0;
	}
	
.dtspace {margin-top: 5vh;}
	
.dttxt {
	font-size: 3.5vw;
	margin-bottom: 2vh;
	}

.dttxt02 {
	font-size: 3.5vw;
	}
	
.dttxt03 {
	font-size: 3.5vw;
	line-height: 1.9em;
	margin-bottom: 1vh;
	}
	
.linkBtn {
	margin: 5vh 0 7vh 0;
	}

.linkBtn ul {
	margin: 2vh 0;
	}
	
.linkBtn ul li {
	list-style: none;
	text-align: center;
	width: 80vw;
	margin: 2vh auto 0 auto;
	}

.linkBtncolor01 ul li a {background-color: #499bee;}
	
.linkBtn ul li a {
	padding: 2.5vh 0;
	border-radius: 3px 3px 3px 3px;
	vertical-align: middle;
	display: block;
	font-size: 4vw;
	color: #fff;
	}
	
.linkBtn ul li a:hover {
	filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all  0.5s ease;
	}
	
.linkBtn ul li.linklast a {margin-right: 0px;}
	
.l_area {
	width: 90vw;
	margin: 0 0 5vh 0;
	}

.l_area a.txtshop {
	border: solid .2em #505050;
	color: #505050;
	display: block;
	text-align: center;
	width: 15em;
	border-radius: .2em;
}

.l_area a.txtshop:hover {
	background-color: #505050;
	color: #fff;
}
	
.r_area {
	width: 90vw;
	margin: 0 0 5vh 0;
	}
	
.pr {font-size: 7vw;}
	
.kzBtn a {
	width: 90vw;
	margin: 2vh auto 3vh auto;
	text-align: center;
	padding: 2vh 0;
	display: block;
	font-size: 5vw;
	font-weight: bold;
	color: #ec6d56;
	border: solid 3px #ec6d56;
	}
	
.kzBtn a:hover {
	color: #fff;
	border: solid 3px #ec6d56;
	background-color: #ec6d56;
	}
	
.kzlink {
	text-align: center;
	font-size: 3.7vw;
	margin-bottom: 1.6vh;
	}
	
.kzlink a {
	color: #303030;
	text-decoration: underline;
	}
	
.kzlink a:hover {
	color: #838383;
	text-decoration: none;
	}

	
/*///////// ステップ／受講パターン //////////*/
	
.steptitle {
	width: 90vw;
	margin: 0 auto ;
	}

	
.steptitle h1 {
	font-size: 6vw;
	color: #000;
	padding: 1vh 0;
	}
	
.stepsab {
	font-size: 3.5vw;
	line-height: 1.6em;
	}
	
.stepimg {
	margin: 0 auto 10vh auto;
	}
	
.patternimg {
	margin: 5vh auto 5vh auto;
	padding: 2vh 3vw 3vh 3vw;
	text-align: center;
	}
	
.patternback01 {background-color: #dff3e0;}
.patternback02 {background-color: #f1e1f3;}
	
.casebox {
	font-size: 4vw;
	padding: 1vh 0;
	color: #fff;	
	text-align: center;
	}
	
.boxcolor01 {background-color: #62bf69;}
.boxcolor02 {background-color: #a268a9;}
	
.casetxt {
	font-size: 4vw;
	margin: 2vh 0 3vh 0;
	font-weight: bold;
	}
	
.patternimg img {
	width: 85vw;
	margin: 0 auto;
	text-align: center;
	clear: both;
	}
	

/*///////// サイドメニュー //////////*/
	
/* サイドオープン時にメインコンテンツを覆う部分 */
.overlay {
  content: '';
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0);
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  z-index: 3;
}
.overlay::after {
  visibility: hidden;
  position: fixed;
  top: 40%;
  left: 0;
  display: block;
  width: 100%;
  height: 50px;
  color: rgba(255,255,255,0);
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}
.side-open .overlay {
  visibility: visible;
  cursor: pointer;
  background: rgba(0,0,0,.4);
}
.side-open .overlay::after {
  visibility: visible;
  color: rgba(255,255,255,.8);
}

.allarea {
  position: relative;
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  z-index: 2;
}
	
/* サイドメニュー ※リストのスタイルは省略 */
.side-menu {
	position: fixed;
	top: 0;
	right: 0;
	width: 70vw;
	height: 100%;
	padding: 3vh 4vw 0 0;
	text-align: left;
	font-size: 13px;
	background: #fff;
	z-index: 1;
	overflow-y: auto;
}


/* 開閉用ボタン ※ボタンの細かいスタイルは省略 */
/*.side-menu-btn {
  position: fixed;
  top: 25vh;
  right: 0px;
  width: 9.5vw;
  cursor: pointer;
  z-index: 4;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}*/

/* 開閉用ボタン ※ボタンの細かいスタイルは省略 */
.side-menu-btn {
  position: fixed;
  top: 15vh;
  right: -1px;
  width: 14vw;
  cursor: pointer;
  z-index: 4;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}

/* サイドメニューオープン */
.side-open .allarea,
.side-open .overlay,
.side-open .side-menu-btn {
  -webkit-transform: translate3d(-79vw, 0, 0);
  transform: translate3d(-79vw, 0, 0);
}
	
	
/*///////// サブメニュー //////////*/
.accordion {
    background: #FFF;
 }

.accordion .link {
	cursor: pointer;
	display: block;
	padding: 2vh 0;
	font-size: 4.5vw;
	text-align: center;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
	
.adcolor01 {color: #499bee;}
.adcolor02 {color: #f16482;}
.adcolor03 {color: #b769c8;}
.adcolor04 {color: #ee8f49;}
.adcolor05 {color: #62bf69;}
	
.accordion li{
	margin: 1vh 0;
	}

.accordion li:last-child .link {
    border-bottom: 0;
}


	
.accordion li.open i.fa-chevron-down {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.accordion li.default .submenu {display: block;}
/**
 * Submenu
 -----------------------------*/

.zenpan {border: solid 2px #499bee; border-radius: 3px;}
.medical {border: solid 2px #f16482; border-radius: 3px;}
.tokkyo {border: solid 2px #b769c8; border-radius: 3px;}
.it-denki {border: solid 2px #ee8f49; border-radius: 3px;}
.kinyu {border: solid 2px #62bf69; border-radius: 3px;}
	
.submenu {
    display: none;
    font-size: 3.5vw;
	padding: 0 10px 8px;
 }

.submenu li {
	padding: 0 0 0 0;
	display: block;}

.submenu li.kzlevel01{color: #499bee; margin-top: 8px;}
.submenu li.kzlevel02{color: #f16482; margin-top: 8px;}
.submenu li.kzlevel03{color: #b769c8; margin-top: 8px;}
.submenu li.kzlevel04{color: #ee8f49; margin-top: 8px;}
.submenu li.kzlevel05{color: #62bf69; margin-top: 8px;}

.submenu a {
    display: block;
	padding: 0.2vh 0 0.2vh 3vw;
    text-decoration: none;
    color: #000;
    -webkit-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
 }

 .submenu a:hover {
    color: #FFF;
 }
	
.menucolor01 a:hover {background: #499bee;}
.menucolor02 a:hover {background: #f16482;}
.menucolor03 a:hover {background: #b769c8;}
.menucolor04 a:hover {background: #ee8f49;}
.menucolor05 a:hover {background: #62bf69;}
	
	
}




@media print, screen and (min-width: 769px){

/*
**  pc
============== ============== ============== ============== ============== ============== ============== */

/*///////// 講座一覧トップ //////////*/
.cgarea a:hover .cg01 {
	border: solid 2px #499bee;
	background-color: #499bee;
	color: #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	
.cgarea a:hover .cg02 {
	border: solid 2px #f16482;
	background-color: #f16482;
	color: #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	
.cgarea a:hover .cg03 {
	border: solid 2px #b769c8;
	background-color: #b769c8;
	color: #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	
.cgarea a:hover .cg04 {
	border: solid 2px #ee8f49;
	background-color: #ee8f49;
	color: #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	
.cgarea a:hover .cg05 {
	border: solid 2px #62bf69;
	background-color: #62bf69;
	color: #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	
.cgarea a:hover .cgtt {
	color: #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	
.cgarea a:hover .cgboder {
	color: #fff;
	border-bottom: solid 2px #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	
.cgarea a:hover .cgtxt {
	color: #fff;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	

	
.cg {
	margin: 0 30px 30px 0;
	float: left;
	text-align: center;
	padding:  25px 20px 20px 20px;
	width: 292px;
	height: 145px;
	}
	
.cgarea a:nth-child(3n) div {
	margin-right: 0;
}

.cgarea a:last-child div {
	margin-bottom: 80px;
}

.cg01 {border: solid 2px #499bee;}
.cg02 {border: solid 2px #f16482;}
.cg03 {border: solid 2px #b769c8; /*margin-right: 0px;*/}
.cg04 {border: solid 2px #ee8f49;}
.cg05 {border: solid 2px #62bf69; /*margin-bottom: 80px;*/}
	
.cgtt {font-size: 20px;}
	
.cgtt01 {color: #499bee;}
.cgtt02 {color: #f16482;}
.cgtt03 {color: #b769c8;}
.cgtt04 {color: #ee8f49;}
.cgtt05 {color: #62bf69;}
	
.cgboder {
	width: 90px;
	margin: 15px auto 20px auto;
	}
	
.cgbodercolor01 {border-bottom: solid 2px #499bee;}
.cgbodercolor02 {border-bottom: solid 2px #f16482;}
.cgbodercolor03 {border-bottom: solid 2px #b769c8;}
.cgbodercolor04 {border-bottom: solid 2px #ee8f49;}
.cgbodercolor05 {border-bottom: solid 2px #62bf69;}
	
.cgtxt {
	font-size: 13px;
	line-height: 1.7em;
	color: #000
	}
	
.ptarea {
	clear: both;
	width: 100%;
	background-color: #f4f4f4;
	background-repeat: repeat;
	padding: 30px 0;
	margin-top: 40px;
	}
	
.ptBtn {
	width: 740px;
	margin: 0 auto;
	}
	
	
	
/*///////// 分野トップ //////////*/
.bunyaback {
	padding: 30px 0 50px 0;
	margin-bottom: 80px;
	position: relative;
	}
.bunyabackcolor01{background-color: #ebf4fe; background-repeat: repeat;}
.bunyabackcolor02{background-color: #fef0f2; background-repeat: repeat;}
.bunyabackcolor03{background-color: #f0ebfe; background-repeat: repeat;}
.bunyabackcolor04{background-color: #fef8eb; background-repeat: repeat;}
.bunyabackcolor05{background-color: #ebfeec; background-repeat: repeat;}
	
.bunyatitle {
	width: 1100px;
	margin: 0 auto ;
	}
	
.bunyabox {
	font-size: 40px;
	margin-top: 18px;
	float: left;
	}
.bbcolor01 {color: #499bee;}
.bbcolor02 {color: #f16482;}
.bbcolor03 {color: #b769c8;}
.bbcolor04 {color: #ee8f49;}
.bbcolor05 {color: #62bf69;}
	
.bunyatitle h1 {
	font-size: 38px;
	padding: 20px 0 15px 30px;
	letter-spacing: 3px;
	float: left;
	}
.bunyacolor01 h1 {color: #499bee;}
.bunyacolor02 h1 {color: #f16482;}
.bunyacolor03 h1 {color: #b769c8;}
.bunyacolor04 h1 {color: #ee8f49;}
.bunyacolor05 h1 {color: #62bf69;}
	
.bunyatitle h1 span {
	font-size: 64%;
}

.subtitle { /** 長い副題がある場合 */
	display: block;
	font-size: 64%;
}

.bunyasab {
	clear: both;
	margin-left: 48px;
	width: 1000px;
	font-size: 17px;
	line-height: 2em;
	}
	
.koza-ichiran article:nth-child(odd)  {
	text-align: center;
	margin-bottom: 70px;
	}
	
.koza-ichiran article:nth-child(even)  {
	text-align: center;
	margin-bottom: 70px;
	padding: 55px; 0 0px 0;
	background-color: #f4f4f4;
	background-repeat: repeat;
	}

.kzcolor01 {color: #499bee;}
.kzcolor02 {color: #f16482;}
.kzcolor03 {color: #b769c8;}
.kzcolor04 {color: #ee8f49;}
.kzcolor05 {color: #62bf69;}
	
.kztitle {
	display: flex;
	align-items: center;
	width: 500px;
	margin: 0 auto 40px auto;
	font-size: 28px;
	letter-spacing: 5px;
	}
	
.kztitle:before,
.kztitle:after {
	border-top: 1px solid;
	content: "";
	flex-grow: 1;
	}
	
.kztitle:before {
	margin-right: 2rem;
	color: #000;
	}
	
.kztitle:after {
	margin-left: 2rem;color: #000;
	}

.kzarea {
	width: 1100px;
	margin: 0 auto;
	position: relative; 
	overflow: hidden;
	}

.kzarea ul {
	/*position: relative;
	left: 50%;
	float: left;
	margin-bottom: 30px;*/
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	}
	
.kzarea ul li {
	/*position: relative;
	left: -50%;
	float: left;
	list-style: none;*/
	margin-bottom: 30px;
	}

.kzbocolor01 ul li a {border: solid 2px #499bee;}
.kzbocolor01 ul li a:hover {background-color: #499bee;}

.kzbocolor02 ul li a {border: solid 2px #f16482;}
.kzbocolor02 ul li a:hover {background-color: #f16482;}
	
.kzbocolor03 ul li a {border: solid 2px #b769c8;}
.kzbocolor03 ul li a:hover {background-color: #b769c8;}

.kzbocolor04 ul li a {border: solid 2px #ee8f49;}
.kzbocolor04 ul li a:hover {background-color: #ee8f49;}
	
.kzbocolor05 ul li a {border: solid 2px #62bf69;}
.kzbocolor05 ul li a:hover {background-color: #62bf69;}
	
.kzarea ul li a {
	width: 470px;
	/*margin-right: 30px;*/
	padding: 18px 0;
	border-radius: 3px 3px 3px 3px;
	vertical-align: middle;
	display: block;
	font-size: 18px;
	color: #000;
	background-color: #fff;
	}
.kzarea ul li a:hover {color: #fff;}
	
.kzarea ul li.kzlast a {margin-right: 0px;}
.kzarea ul li.kzlast02 a {margin: 0 0 80px 0;}
	
	

/*///////// 講座詳細 //////////*/
	
.kzbox {
	font-size: 18px;
	border: solid 1px #000;
	width: 197px;
	padding: 5px 0;
	text-align: center;
	margin-left: 75px;
	}
	
.sabgengo {
	margin: 30px 0 0 10px ;
	float: left
	}
	
.sabgengo li {
	width: 100px;
	padding: 5px 0 3px 0;
	margin: 0 0 50px 10px;
	background-color: #3b3b3b;
	display: inline-block;
	text-align: center;
	color: #fff;
	}

.datatitle {
	clear: both;
	font-size: 19px;
	font-weight: bold;
	margin: 0 0 15px 75px;
	}

.detailssab {
	margin-left: 75px;
	width: 980px;
	font-size: 16px;
	line-height: 1.7em;
	}
	
.dtarea {
	width: 950px;
	margin: 0 auto;
	}
	
.dttt {
	font-size: 20px;
	font-weight: bold;
	border-bottom: solid 1px #c6c6c6;
	padding: 0 0 10px 0;
	margin-bottom: 25px;
	}
	
.dtlist li{
	font-size: 16px;
	margin-bottom: 10px;
	}
	
.dtlist02{
	list-style-type: square;
	margin: 0 0 30px 30px;
	float: left;
	}
	
.dtlist02 li{
	font-size: 16px;
	margin: 0 0 10px 0;
	width: 450px;
	float: left;
	}
	
.dtspace {margin-top: 60px;}
	
.dttxt {
	font-size: 16px;
	margin-bottom: 15px;
	}

.dttxt02 {
	font-size: 16px;
	}
	
.dttxt03 {
	font-size: 16px;
	line-height: 2em;
	margin-bottom: 15px;
	}
	
.linkBtn {
	position: relative; 
	overflow: hidden;
	margin-bottom: 70px;
	}

.linkBtn ul {
	position: relative;
	left: 50%;
	float: left;
	margin: 30px 0;
	}
	
.linkBtn ul li {
	position: relative;
	left: -50%;
	float: left;
	list-style: none;
	text-align: center;
	}

.linkBtncolor01 ul li a {background-color: #499bee;}
	
.linkBtn ul li a {
	width: 355px;
	margin-right: 30px;
	padding: 18px 0;
	border-radius: 3px 3px 3px 3px;
	vertical-align: middle;
	display: block;
	font-size: 17px;
	color: #fff;
	}
	
.linkBtn ul li a:hover {
	filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all  0.5s ease;
	}
	
.linkBtn ul li.linklast a {margin-right: 0px;}
	
.l_area {
	width: 450px;
	float: left;
	margin-right: 50px;
	}

.l_area a.txtshop {
	border: solid .2em #505050;
	color: #505050;
	display: block;
	text-align: center;
	width: 15em;
	border-radius: .2em;
}

.l_area a.txtshop:hover {
	background-color: #505050;
	color: #fff;
}
	
.r_area {
	width: 450px;
	float: left;
	margin-right: 0px;
	}
	
.pr {font-size: 28px;}
	
.kzBtn a {
	width: 515px;
	margin: 15px auto 30px auto;
	text-align: center;
	padding: 18px 30px;
	display: block;
	font-size: 20px;
	font-weight: bold;
	color: #ec6d56;
	border: solid 4px #ec6d56;
	}
	
.kzBtn a:hover {
	color: #fff;
	border: solid 4px #ec6d56;
	background-color: #ec6d56;
	}
	
.kzlink {
	text-align: center;
	}
	
.kzlink a {
	text-align: center;
	color: #303030;
	text-decoration: underline;
	}
	
.kzlink a:hover {
	color: #838383;
	text-decoration: none;
	}
	
	
/*///////// ステップ／受講パターン //////////*/
	
.steptitle {
	width: 1100px;
	margin: 0 auto ;
	}

	
.steptitle h1 {
	font-size: 35px;
	color: #000;
	padding: 20px 0 15px 0;
	letter-spacing: 3px;
	}
	
.stepsab {
	font-size: 17px;
	line-height: 2em;
	}
	
.stepimg {
	width: 920px;
	margin: 0 auto 100px auto;
	}
	
.patternimg {
	width: 920px;
	margin: 55px auto 100px auto;
	padding: 0 0 40px 0;
	text-align: center;
	}
	
.patternback01 {background-color: #dff3e0;}
.patternback02 {background-color: #f1e1f3;}
	
.casebox {
	font-size: 17px;
	width: 90px;
	padding: 3px 0;
	color: #fff;	
	text-align: center;
	float: left;
	margin: 35px 0 0 -25px;
	}
	
.boxcolor01 {background-color: #62bf69;}
.boxcolor02 {background-color: #a268a9;}
	
.casetxt {
	font-size: 23px;
	float: left;
	margin: 35px 0 40px 15px;
	font-weight: bold;
	text-align: left;
	}
	
.patternimg img {
	width: 850px;
	margin: 0 auto;
	text-align: center;
	clear: both;
	}
	
	
	
/*///////// サイドメニュー //////////*/
	
/* サイドオープン時にメインコンテンツを覆う部分 */
.overlay {
  content: '';
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0);
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  z-index: 3;
}
.overlay::after {
  visibility: hidden;
  position: fixed;
  top: 40%;
  left: 0;
  display: block;
  width: 100%;
  height: 50px;
  color: rgba(255,255,255,0);
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}
.side-open .overlay {
  visibility: visible;
  cursor: pointer;
  background: rgba(0,0,0,.4);
}
.side-open .overlay::after {
  visibility: visible;
  color: rgba(255,255,255,.8);
}

.allarea {
  position: relative;
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  z-index: 2;
}
	
/* サイドメニュー ※リストのスタイルは省略 */
.side-menu {
	position: fixed;
	top: 0;
	right: 0;
	width: 270px;
	height: 100%;
	padding: 20px 18px 0 0;
	text-align: left;
	font-size: 13px;
	background: #fff;
	z-index: 1;
	overflow-y: auto;
}


/* 開閉用ボタン ※ボタンの細かいスタイルは省略 */
/*.side-menu-btn {
  position: fixed;
  top: 285px;
  right: 0px;
  width: 40px;
  cursor: pointer;
  z-index: 4;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}*/

/* 開閉用ボタン ※ボタンの細かいスタイルは省略 */
	
.side-menu-btn {
  position: fixed;
  top: 200px;
  right: -16px;
  width: 90px;
  cursor: pointer;
  z-index: 4;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  transition-duration: 0.5s;
}
	
.side-menu-btn:hover { transform:translateX(-14px); }


/* サイドメニューオープン */
.side-open .allarea,
.side-open .overlay,
.side-open .side-menu-btn {
  -webkit-transform: translate3d(-310px, 0, 0);
  transform: translate3d(-310px, 0, 0);
}
	
	
/*///////// サブメニュー //////////*/
.accordion {
    background: #FFF;
 }

.accordion .link {
	cursor: pointer;
	display: block;
	padding: 10px 0;
	font-size: 18px;
	text-align: center;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
	
.adcolor01 {color: #499bee;}
.adcolor02 {color: #f16482;}
.adcolor03 {color: #b769c8;}
.adcolor04 {color: #ee8f49;}
.adcolor05 {color: #62bf69;}
	
.accordion li{
	margin: 5px 0;
	}

.accordion li:last-child .link {
    border-bottom: 0;
}

.accordion li i {
    position: absolute;
    top: 16px;
    left: 12px;
    font-size: 18px;
    color: #595959;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.accordion li i.fa-chevron-down {
    right: 12px;
    left: auto;
    font-size: 16px;
}
	
.accordion li.open i.fa-chevron-down {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.accordion li.default .submenu {display: block;}
/**
 * Submenu
 -----------------------------*/

.zenpan {border: solid 2px #499bee; border-radius: 3px;}
.medical {border: solid 2px #f16482; border-radius: 3px;}
.tokkyo {border: solid 2px #b769c8; border-radius: 3px;}
.it-denki {border: solid 2px #ee8f49; border-radius: 3px;}
.kinyu {border: solid 2px #62bf69; border-radius: 3px;}
	
.submenu {
    display: none;
    font-size: 13px;
	padding: 0 10px 8px;
 }

.submenu li {
	padding: 0 0 0 0;
	display: block;}

.submenu li.kzlevel01{color: #499bee; margin-top: 8px;}
.submenu li.kzlevel02{color: #f16482; margin-top: 8px;}
.submenu li.kzlevel03{color: #b769c8; margin-top: 8px;}
.submenu li.kzlevel04{color: #ee8f49; margin-top: 8px;}
.submenu li.kzlevel05{color: #62bf69; margin-top: 8px;}

.submenu a {
    display: block;
	padding: 3px 0 2px 10px;
    text-decoration: none;
    color: #000;
    -webkit-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
 }

 .submenu a:hover {
    color: #FFF;
 }
	
.menucolor01 a:hover {background: #499bee;}
.menucolor02 a:hover {background: #f16482;}
.menucolor03 a:hover {background: #b769c8;}
.menucolor04 a:hover {background: #ee8f49;}
.menucolor05 a:hover {background: #62bf69;}
	
}