@charset "utf-8";

/*
Theme Name:Cosmic Academy Japan
Theme URL:
Description:
*/


/* CSS Document */

*{
	margin:0;
	padding:0;
	border:0;
}

body{
	background-color:#fff;
	color:#333;
	line-height:100%;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	
}


/*sample*/
.code{
	border:1px #000 solid;
	padding:2em 2em 0.5em 2em;
	margin-bottom:2em;
	font-size:13px;	
}

p#hide_content{
	visibility: collapse;
	background-color: aqua;
	}
#read_btn{
		
	}

/*SNSアイコン*/

.btn-sns-box{
	overflow:hidden;
}

.btn-sns-box p{
	float:left;
	margin-right:8px;	
}

a.btn-sns{
	width:50px;
	height:50px;
	font-size:30px;
	
	color:#fff!important;
	background-color:#4a4692;
	border-radius:50%;
	display:block;
	text-decoration:none;
	text-align:center;
transition:1s;
}

a.btn-sns i{
	line-height:50px;
}

a.btn-sns:hover {
	background-color:#a4a2c8;
}


/*リンク*/

a{
	color:#6c249a;
	text-decoration:none;
}

a:link{
	color:#6c249a;
}

a:active{
	color:#6c249a;
}

a:hover{
	color:#6c249a;
	text-decoration:underline;
}

#header a{
	color:#4a4692;
	text-decoration:none;
}

#header a:link{
	color:#4a4692;
}

#header a:active{
	color:#4a4692;
}

#header a:hove{
	color:#4a4692;
}

#navigation a{
	color:#fff;
	text-decoration:none;
}

#navigation a:link{
	color:#fff;
}

#navigation a:active{
	color:#fff;
}

#navigation a:hove{
	color:#fff;
}


.btn-more a{
	color:#fff;
	text-decoration:none;
}

.btn-more a:link{
	color:#fff;
}

.btn-more a:active{
	color:#fff;
}

.btn-more a:hove{
	color:#fff;
}






.side-contents a{
	color:#333;	
	text-decoration:none;
}
.side-contents a:link{
	color:#333;	
}
.side-contents a:active{
	color:#333;	
}
.side-contents a:hover{
	color:#666;	

}

/* --------------------------
Pagenation
-------------------------- */
.pager{
	text-align:center;
	clear:both;
	font-size:13px;
	margin:40px 0;
}
a.page-numbers,
.pager .current{
	background-color:#fff;
	border:solid 1px #ccc;;
	padding:5px 8px;
	margin:0 2px;
}
.pager .current{
	background:#000;
	border:solid 1px #ccc;
	color:#fff;
}

/*基本構造*/

#wrapper{
	width:100%;
	margin:auto;
		font-size:15px;
}

.inner{
	width:1000px;
	margin:auto;

}

#header-top{
	width:100%;
	text-align:right;
	background-color:#ededed;
	border-bottom:1px #ebebeb solid;
	padding:3px 0;
	font-size:13px;
}

#header{
	width:100%;
	/*margin-bottom:40px;*/
}

#mainphoto{
	text-align:center;
	margin:auto;	
	background-image:url("/assets/bg-mainphoto.png");
	background-repeat:repeat-x;
	margin-bottom:0;
}

#mainphoto img{
	max-width:100%;	
	height:auto;
}

#navigation{
	width:100%;
	background-color:#4a4692;
	margin-bottom:40px;
}

#main{
	width:730px;	
	float:left;
	margin-bottom:40px;
}

#side{
	width:220px;
	float:right;
	margin-bottom:40px;
}

#footer{
	width:100%;
	border-top:#000 2px solid;


	clear:both;	
}


/*hタグ*/

#main h1{
	font-size:26px;	
	font-weight:bold;
	line-height:120%;
	margin-bottom:1.5em;
	position: relative;
	padding: 18px 0 18px 26px;
}

#main h1::after {
	position: absolute;
	top: .5em;
	left: 5px;
	content: '';
	width: 8px;
	height: -webkit-calc(100% - 1em);
	height: calc(100% - 1em);
	background-color: #4a4692;
	border-radius: 4px;
}

.main-inner-top h2{
	font-size:26px;	
	font-weight:bold;
	margin-bottom:1.5em;
	text-align:center;
	overflow:hidden;
	font-family: 'Cinzel', serif;
	color:#806ba0;
}

.h2-line{
	position: relative;
	display: inline-block;
	margin: 0 2.5em;
	padding: 0 1em;
	text-align: left;
}

.h2-line::before,
.h2-line::after{
	position: absolute;
	top: 20%;
	content: '';
	width: 100%;
	height: 1px;
	background-color: #ccc;
}

.h2-line::before{
	right: 100%;
}
.h2-line::after{
	left: 100%;
}

.h2-subtitle{
	display:block;
	font-size:12px;	
	font-weight:normal;
	color:#806ba0;
	text-align:center;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.main-inner h2{
	font-size:18px;	
	font-weight:bold;
	margin-bottom:1.5em;	
	padding:10px;
	background-color:#c8c7de;
	border-radius: 2px;
	color:#fff;
}

#main h3{
	font-size:15px;	
	font-weight:bold;
	margin-bottom:1.5em;
	border:2px solid #9290be;
	padding:6px 10px;
	border-radius: 2px;
	color:#4a4692;
}

#main h4{
	font-size:15px;	
	font-weight:bold;
	margin-bottom:0.5em;
	color:#9290be;
}

#side h2{
	font-size:15px;	
	/*border:2px #000 solid;*/
	background-color:#9290be;
	border-radius:3px;
	color:#fff;
	font-weight:normal;
	padding:5px 10px;
	margin-bottom:1.5em;
	text-align:center;
}


/*-----------テキスト類-----------*/

strong{
	font-weight:bold;	
}

em{
	background: linear-gradient(transparent 50%, #b4e1e7 50%);
	font-style:normal;
}

.lead{
	font-size:18px;
	font-weight:bold;
	color:#bda65f;	
}

.fs12{
	font-size:12px;	
}

.fs13{
	font-size:13px;	
}

.fs15{
	font-size:15px;	
}

.fs18{
	font-size:18px;
}

.fs21{
	font-size:21px;	
}

/*-----------マージン調整-----------*/

.mt5{
	margin-top:5px;
}

.mt10{
	margin-top:10px;
}

.mt15{
	margin-top:15px;
}

.mt20{
	margin-top:20px;
}

.mt25{
	margin-top:25px;
}

.mt30{
	margin-top:30px;
}

.mt40{
	margin-top:40px;
}

.mb5{
	margin-bottom:5px;
}

.mb10{
	margin-bottom:10px;
}

.mb15{
	margin-bottom:15px;
}

.mb20{
	margin-bottom:20px;
}

.mb25{
	margin-bottom:25px;
}

.mb30{
	margin-bottom:30px;
}

/*位置揃え*/

.ar{
	text-align:right;
}

/*-----------box類-----------*/

.box01{
	border:2px #9290be solid;
	padding:2em 2em 0.5em 2em;
	margin-bottom:2em;
	font-size:13px;	
}

.box02{
	border:2px #ededed solid;
	padding:2em 2em 0.5em 2em;
	margin-bottom:2em;
	font-size:13px;	
}

.box03{
	border:1px #9290be dotted;
	padding:2em 2em 0.5em 2em;
	margin-bottom:2em;
	font-size:13px;	
}

/*-----------ボタン類-----------*/

/*moreボタン*/

.btn-more{
	clear:both;
	text-align:center;
	
}

.btn-more a{
	display:inline-block;	
	background-color:#4a4692;
	border-radius:3px;
	padding:8px 25px;
	margin:5px auto;
	transition:1s;	
	font-size:13px;
	
	
}

.btn-more a:hover{
	background-color:#a4a2c8;
	
}

.btn-side{
	text-align:center;
	font-family: 'Cinzel', serif;
color:#fff;
}

.btn-side a{
	display:block;
	background-color:#9dba6d;
	border-radius:3px;
	padding:8px 0;
	margin:8px auto;
	transition:1s;	
	font-size:18px;
color:#fff;
width:100%;
}

.btn-side a:hover{
	background-color:#b9d091;
	color:#fff;
	
}

.btn-side-sub{
	font-size:13px;
}

/*-----------リスト類-----------*/

/*ふつうの*/

ul.list-normal{
	margin-bottom:1.5em;
	margin-left:1.5em;
}

ul.list-normal-margin{
	margin-bottom:1.5em;
	margin-left:1.5em;
}


ol.list-normal{
	margin-bottom:1.5em;
	margin-left:2.2em;
}

.list-normal-margin li{
	margin-bottom:1em;
}

/*ぶらさがり*/

ul.list-notice{
	list-style-type:none;
	margin-bottom:1.5em;
	margin-left:1.5em;
}

.list-notice li{
	/*font-size:15px;*/
}

.list-notice li:before{
	content: "※";
	margin-left: -1em;

}

/*リンク*/

ul.list-link{
	list-style-type:none;
	margin-bottom:1.5em;
	margin-left:10px;
}

.list-link li{
	list-style-type:none;	
	/*font-size:15px;*/
	position:relative;
	padding-left:1.2em;
}

.list-link li:before{
	font-family: FontAwesome;
	content: "\f0da";
	left: 0;
	position: absolute;
	top: 0;	
}

/*ページ内リンク*/

ul.list-anchor{
	list-style-type:none;
	margin-bottom:1.5em;
	margin-left:10px;
}

.list-anchor li{
	list-style-type:none;	
	/*font-size:15px;*/
	position:relative;
	padding-left:1.2em;
}

.list-anchor li:before{
	font-family: FontAwesome;
	content: "\f0d7";
	left: 0;
	position: absolute;
	top: 0;	
}

/*キャプション*/

.wp-caption, .alignnone{
	max-width: 100%;
}

/*------------------------------------
           各パーツごと
------------------------------------*/


/*---------header関連---------*/

#mobile_login{
	display:none;
}

#logo{
	float:left;
	margin:5px 0;
}

#navi_header{
	float:right;
}

/*---------menu関連---------*/

ul.main-menu{
	list-style-type:none;
	width:100%;
	font-family: 'Cinzel', serif;
}

.main-menu li{
	float:left;
	width:20%;	
	text-align:center;
	font-size:18px;
	background-color:#4a4692;
}

.main-menu li a{
	display:block;	
	padding:15px 0 10px 0;
transition:1s;
}

.main-menu li a:hover{
	background-color:#3d3980;
}

.menu-sub{
	display:block;	
	font-size:11px;
	padding-top:3px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.menu-icon img{
	width:15%;
	height:15%;
	vertical-align:middle;
	padding:0 3px 3px 0;
}


/*ドロワーメニュー*/

.btn {
    display: none;
}
.btn-close {
    display: none;

}
.drawr {
    display: none;

}


ul.menu_header{
	list-style-type:none;
	margin-top:40px;
}

.menu_header li{
	float:left;
	font-size:13px;
	border-right:1px #999 dotted;
	padding:0 10px;
}

/*----mainphoto関連----*/

#mainphoto img{
	text-align:center;	
}

/*---------main関連---------*/

/*パンくず*/

.breadcrumb{
	font-size:13px;
	margin-bottom:40px;	
}

/*トップページ*/

.main-inner-top{
	line-height:160%;
}

.main-inner-top p{
	margin-bottom:1.5em;	
}

/*記事・通常ページ*/



.main-inner{
	line-height:160%;
}

.main-inner p{
	margin-bottom:1.5em;	
}

.date{
	margin-bottom:2.5em;	
	font-size:13px;
}


/*講師一覧ページ*/


.list-box-col4{
	width:100%;
	margin-top:20px;
	padding-bottom:20px;
	clear:both;

}

.list-box-col4 .col-01{
	width:22%;
	float:left;	
	margin-right:4%;
}

.list-box-col4 .col-01:nth-child(4n){
	margin-right:0;

}

p.list-box-col4-name{
	font-weight:bold;	
	margin:0;
	padding:0;
}

p.list-box-col4-position{
	font-size:11px;
	color:#666;
	margin:0;
	padding:0;		
}

.list-box-col4-profile{
	font-size:13px;
	line-height:150%;	
	margin:0;
	padding:0;

}
p.list-box-col4-btn{
	margin:5px 0 0 0;
	padding:0;	
	font-size:12px;
}

.lecture-icon-01{
	background-color:#999;
	padding:1px 5px;	
	margin-right:5px;
	white-space:normal;
}


/*一覧ページ（画像大）*/

.list-box-l{
	clear:both;
	margin-top:20px;
	padding-bottom:20px;
	border-bottom:1px #ededed dotted;
}

.list-box-l-img{
	float:left;	
	width:40%;
}

.list-box-l-text{
	float:right;
	width:55%;	
}

.list-box-l-img img{
	width:100%;
	height:auto;	
}

.list-box-l-title{
	font-size:18px;
	font-weight:bold;	
}

.list-box-l-excerpt{
	font-size:13px;
	line-height:150%;	
	margin-top:0.5em;
}

.list-box-l-date{
	font-size:13px;
	margin-top:1em;	
}


.list-box-l-category{
	margin-top:5px;
	font-size:12px;
	color:#fff;
	
}

.category-icon-01{
	background-color:#69c3d0;
	padding:1px 5px;	
	margin-right:5px;
	white-space:normal;
}

.category-icon-02{
	background-color:#c16ae1;
	padding:1px 5px;	
	margin-right:5px;
	white-space:normal;
}

/*一覧ページ（リストタイプ）*/

.list-box-list{
	clear:both;
	width:100%;
	/*margin-top:20px;*/
	padding-bottom:20px;
}

.list-box-list ul{
	list-style-type:none;	
	margin-left:10px;
}

.list-box-list ul li{
	list-style-type:none;	
	/*margin-bottom:5px;*/
	position:relative;
	padding-left:1.2em;
}

.list-box-list ul li:before{
	font-family: FontAwesome;
	content: "\f0da";
	left: 0;
	position: absolute;
	top: 0;	
}

.list-box-list-excerpt{
	font-size:13px;
	line-height:150%;	
	margin-top:0.5em;
}

.info-date{
	font-size:13px;
	color:#666;	
	white-space: nowrap;
}


/*一覧ページ（画像中）*/

.list-box-m{
	clear:both;
	margin-top:20px;
	padding-bottom:20px;
	border-bottom:1px #ededed dotted;
}

.list-box-m-img{
	float:left;	
	width:22%;
}

.list-box-m-text{
	float:right;
	width:73%;	
}

.list-box-m-img img{
	width:100%;
	height:auto;	
}

.list-box-m-title{
	font-size:18px;
	font-weight:bold;	
}

.list-box-m-excerpt{
	font-size:13px;
	line-height:150%;	
	margin-top:0.5em;
}


/*-----記事ページ内のレイアウト-------*/

/*記事を書いた人*/

.box-profile{
	clear:both;
	margin-top:40px;
	margin-bottom:20px;
	padding:15px 0;
	border-bottom:2px #9290be solid;
	border-top:2px #9290be solid;
}

.box-profile-inner{
	clear:both;
}

.box-profile-img{
	float:left;	
	width:15%;
	
}

.box-profile-img img{
	width:100%;
	height:auto;
	border-radius:50%;
}

.box-profile-text{
	float:right;
	width:82%;	
	font-size:13px;
}

.box-profile-text-nophoto{
	font-size:13px;
}

/*囲み・ボックス*/

.box1{
	border:2px #9290be solid;
	padding:2em;
	margin-bottom:2em;
}

/*2カラム+その中の画像*/

.column-02{
	width:100%;
	clear:both;
}

.column-02 .col-01{
	width:48%;
	float:left;	
	margin-right:4%;
}

.column-02 .col-01:nth-child(even){
	margin-right:0;
}



/*3カラム+その中の画像*/

.column-03{
	width:100%;
	clear:both;
}

.column-03 .col-01{
	width:30.5%;
	float:left;	
	margin-right:4%;
}

.column-03 .col-01:nth-child(3n){
	margin-right:0;
	width:31%;
}



/*カラムinner共通*/

.col-01{
	margin-bottom:1.5em;
}

.col-01 p:last-child{
	margin-bottom:0;	
}

.col-01 img{
	width:100%;
	height:auto;
	margin-bottom:10px;	
}

/*画像中央一枚*/

.col-02{
	margin-bottom:1.5em;
	margin-left:auto;
margin-right:auto;
	text-align:center;
}

.col-02 img{

	margin-bottom:10px;		
}


/*画像回り込み*/

.img-right{
	/*width:48%;*/
	float:right;
	margin-left:4%;	
	margin-bottom:20px;
	
}

.img-right img{
	/*width:100%;
	height:auto;*/
	margin:5px 0;

}

.img-left{
	/*width:48%;*/
	float:left;
	margin-right:4%;	
	margin-bottom:20px;
	
}

.img-left img{
	/*width:100%;
	height:auto;*/
	margin:5px 0;

}

.img-caption{
	font-size:13px;	
	line-height:130%;
}



/*table*/

table.table-normal {
	border-collapse:collapse;
	border: 1px #000 solid;
	margin-bottom:2em;
	width:100%;
}

.table-normal th {
	border: 1px #000 solid;
	border-collapse:collapse;
	empty-cells:show;
	padding:5px 10px 5px 10px;
	text-align:center;
	font-weight:normal;
}

.table-normal td {
	border: 1px #000 solid;
	border-collapse:collapse;
	empty-cells:show;
	padding:5px 10px 5px 10px;
}



/*youtube*/

.movie {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
margin-bottom:40px;
}
.movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}


/*メールフォーム*/

.wpcf7-submit{
	clear:both;
	text-align:center;
		display:inline-block;	
	background-color:#4a4692;
	color:#fff;
	border-radius:3px;
	padding:8px 25px;
	margin:20px auto;

}

.wpcf7-text, .wpcf7-textarea{
	border:1px #000 solid;
	padding:5px;
	width:100%;
}

/*アラート*/
.wpcf7-not-valid-tip{

}

/*---------side関連---------*/

.side-contents{
	margin-bottom:30px;	
	font-size:13px;
}


/*sidemenu*/

ul#menu-side{
	list-style-type:none;
	margin-left:10px;
}

#menu-side li{
	list-style-type:none;	
	padding:5px 0;
	position:relative;
	padding-left:1.2em;
}

#menu-side li:before{
	font-family: FontAwesome;
	content: "\f0da";
	padding:5px 0;
	left: 0;
	position: absolute;
	top: 0;	
}


.side-contents img{
	width:100%;
	height:auto;
}



/*---------footer関連---------*/

.footer-inner{
	padding:40px 0;	
}



/*---------clearfix---------*/

.clearfix:after {
content: "."; /* 新しい要素を作る */
display: block; /* ブロックレベル要素に */
clear: both;
height: 0;
visibility: hidden;
}

.clearfix {
min-height: 1px;
}

* html .clearfix {
height: 1px;
/*\*//*/
height: auto;
overflow: hidden;
/**/
}


/*---------上に戻る---------*/


#returnToTop {
	position: fixed;
	bottom: 30px;
	right: 30px;
	display: none;
	font-size:50px;
}

#returnToTop a {
	display: block;
	width: 50px;
	height: 50px;
	color: #666;
	/*text-align: center;*/
	/*line-height: 50px;*/
	-webkit-transition: .1s ease-in-out;
	-moz-transition: .1s ease-in-out;
	-o-transition: .1s ease-in-out;
}

#returnToTop a:hover {
	/*padding-bottom: 5px;*/
	color: #333;
}








/*-----------------------tabret-------------------------*/
@media(max-width:959px){
	
#wrapper{
	width:100%;
	margin:auto;
}

.inner{
	width:100%;
	margin:auto;

}

/*#header{
	width:100%;
	background-color:#ccc;	
	margin-bottom:30px;
}*/

#main{
	width:90%;	
	float:none;
	margin:auto;
	margin-bottom:30px;
}

#side{
	width:90%;
	float:none;
	margin:auto;
	margin-bottom:30px;
}	
	
#footer{
	width:90%;
	float:none;
	margin:auto;
	clear:both;	
}	

/*---------header関連---------*/

#mobile_login{
	display:block;
	float:left;
	width:20%;
}

#logo{
	float:left;
	width:60%;
	text-align:center;
	margin:10px 0;
}



#navi_header{
	float:right;
	width:20%;
}

/*ドロワーメニュー*/

.btn {
    background:transparent url(/assets/btn-menu.png) no-repeat 0 0;
	background-size:100px 50px;
    display: block;
    width:50px;
    height: 50px;
    position: absolute;
    top:50px;
    right:20px;
    cursor: pointer;
    z-index: 200;
}

.btn-close {
    background-position: -50px 0;
}
.drawr {
    display: none;
    background-color:rgba(100,100,100,100);
    position: absolute;
    top: 0px;
    right:0;
    width:260px;
	height:100%;
    padding:60px 0 20px 0px;
    z-index: 100;
}



ul.menu_header{
	display:none;
	list-style-type:none;
	margin-top:50px;
}

.menu_header li{
	float:none;
	font-size:15px;
	border-right:none;
	padding:10px;
}


.drawr ul.menu_sp{
	list-style-type:none;
	width:260px;
	margin-left:0;
	padding:0;
	color:#fff;
}

.drawr .menu_sp li {
	list-style:none;
	border-bottom:1px #fff solid;
	margin-left:0;
}
.drawr .menu_sp li a {
    color:#fff;
    display: block;
    padding: 15px 20px;
list-style:none;
}



/*---------mainphoto関連---------*/

#mainphoto img{
	width:100%;
	height:auto;
}

/*---------side関連---------*/

.side-contents{
	font-size:15px;
}

/*main関連*/

#main img{
	width:100%;
	height:auto;
}

}


/*-----------------------mobile-------------------------*/
@media(max-width:599px){

#logo img{
	width:80%;
	height:auto;
	margin:15px 0;
}


	
/*menu*/

.menu li{

	font-size:15px;

}

.menu-icon img{
	display:block;
	margin:auto;
	width:50%;
	height:50%;
	vertical-align:middle;
	padding:0 0 8px 0;
}

	
/*レイアウト*/



/*講師一覧ページ*/


.list-box-col4{
	width:100%;
	margin-top:20px;
	padding-bottom:20px;
	clear:both;

}

.list-box-col4 .col-01{
	width:48%;
	float:left;	
	margin-right:4%;
}

.list-box-col4 .col-01:nth-child(4n){
	margin-right:0;
}

.list-box-col4 .col-01:nth-child(even){
	margin-right:0!important;

}


/*2カラム+その中の画像*/

.column-02 .col-01{
	width:100%;
	float:none;	
	margin-right:0;
}

.column-02 .col-01:nth-child(even){
	margin-right:0;
}


/*3カラム+その中の画像*/

.column-03 .col-01{
	width:100%;
	float:none;	
	margin-right:0;
}

.column-03 .col-01:nth-child(3n){
	margin-right:0;
	width:100%;
}

/*画像回り込み*/

.img-right{
	width:100%;
	float:none;
	margin-left:0;	
	margin-bottom:20px;
	
}

.img-left{
	width:100%;
	float:none;
	margin-left:0;	
	margin-bottom:20px;
	
}

/*画像中央一枚*/
.col-02{

	text-align:left;
}

.col-02 img{
	width:100%;
	height:auto;
	margin-bottom:10px;		
}

/*table*/

table.table-normal {
	border-collapse:collapse;
	border: 0;
	margin-bottom:2em;
}

.table-normal th {
	display:block;
	border: 0;
	background-color:#CCC;
	padding:5px 10px 5px 10px;
	text-align:left;
	font-weight:normal;
}

.table-normal td {
	display:block;
	border: 0;
	padding:5px 0;
}
		
	
}