@charset "utf-8";
/* CSS Document */
/**************************monthly******************************/
#monthly{
    width: 100%;
}
#monthly h2{
    background: url(/lp/nightsky/img/img-h2nightsky-bg.png) no-repeat;
	height:50px;
	padding:15px 0 0 40px;
	color:#fff;
	margin:0;
}
#monthly ul{
  display: flex;
  align-items:flex-start;
  justify-content:space-between;
    margin: 0 15px 10px 15px;
}
#monthly ul li{
    color: #ccc;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align:center;
    font-size: 13px;
    letter-spacing: 0;
}
#monthly ul li a{
    display: block;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    line-height: 36px;
    text-align:center;
    color: #6d90e6;
    background: none;
    border: 1px solid #6d90e6;
    text-decoration: none;
}
#monthly ul li a:hover{
    color: #fff;
    background: #6d90e6;
    text-decoration: none;
}
.month01 #monthly ul li.month01 a,
.month02 #monthly ul li.month02 a,
.month03 #monthly ul li.month03 a,
.month04 #monthly ul li.month04 a,
.month05 #monthly ul li.month05 a,
.month06 #monthly ul li.month06 a,
.month07 #monthly ul li.month07 a,
.month08 #monthly ul li.month08 a,
.month09 #monthly ul li.month09 a,
.month10 #monthly ul li.month10 a,
.month11 #monthly ul li.month11 a,
.month12 #monthly ul li.month12 a{
    color: #fff;
    background: #3f65c3;
    text-decoration: none;
    font-weight: bold;
    border: 1px solid #3f65c3;
}

/*************************meteostream***************************/
#meteostream{
    width: 100%;
}
#meteostream h2{
    background: url(/lp/nightsky/img/img-h2nightsky-bg.png) no-repeat;
	height:50px;
	padding:15px 0 0 40px;
	color:#fff;
	margin:0;
}
#meteostream ul{
	height:38px;
    display: flex;
    align-items:flex-start;
    justify-content:space-between;
    margin: 15px 0;
}
#meteostream ul li {
    color: #ccc;
}
#meteostream ul li a{
    border:1px solid #6d90e6;
    border-radius: 3px;
    padding: 13px 10px;
    font-size: 12px;
    text-decoration: none;
    color: #6d90e6;
}
#meteostream ul li a:hover{
    background:#6d90e6; 
    color: #fff;
}
.meteo01 #meteostream ul li:nth-child(1) a,
.meteo02 #meteostream ul li:nth-child(2) a,
.meteo03 #meteostream ul li:nth-child(3) a,
.meteo04 #meteostream ul li:nth-child(4) a,
.meteo05 #meteostream ul li:nth-child(5) a{
    color: #fff;
    background: #3f65c3;
    text-decoration: none;
    font-weight: bold;
}
/*************************teacher-profile***************************/
ul#teacher-profile{
	display: flex;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    flex-wrap:wrap;
}
ul#teacher-profile li{
	margin:0 auto 10px auto;
	width:126px;
}
ul#teacher-profile .profile-img img{
    margin-bottom: 10px;
}
ul#teacher-profile a{
    font-weight: bold;
}
.profileDetail{
	padding:20px;
}
.profileDetail h3{
	font-size:180%;
	margin:0 0 10px 0;
	padding:0;
}
.profileDetail h3>span.txt-small{
	font-size:80%;
}
/*************************nightskyContents***************************/
.nightskyBox > h2{
    background: url(/lp/nightsky/img/img-h2nightsky-bg.png) no-repeat;
	height:50px;
	padding:15px 0 0 40px;
	color:#fff;
	margin:0;
}
.nightskyBox{
	clear:both;
    background: url(/lp/nightsky/img/img-ns-bg.png) repeat-y #221F1A;
	color:#fff;
	margin-bottom:10px;
}
.nightskyContents{
	padding:20px;
}
.nightskyContents img{
}
.nightskyContents > h3{
	color:#fff;
	font-size:240%;
	text-align:center;
	border:none;
	padding:0;
	margin:0 0 10px 0;
}
.starBox {
	background:rgba(255,255,255,0.2);
    width: 550px;
    padding:6px;
	border:#fff 1px solid;
	margin:0 auto 10px auto;
}
.nightskyContents dl {
	margin:0 auto 10px auto;
    width: 550px;
    height: 40px;
	padding: 6px;
    overflow: hidden;
    background: url(/lp/nightsky/img/img-starbox-bg.png) repeat-y;
	border:#fff 1px solid;
}
.nightskyContents dl dt {
    width: 130px;
    height: 30px;
    padding: 13px 0 0 0;
    float: left;
	font-size:11px;
	font-weight:bold;
	color:#fff;	
}
.nightskyContents dl dd {
    width: 135px;
    height: 25px;
    margin: 0 7px 0 0;
    padding: 13px 0 0 0;
    float: left;
    color: #fff;
    text-align: center;
	background:#21334e;
	font-size:11px;
}
.nightskyContents dl dd:last-child {
    margin-right: 0;
}
.nightskyContents dl.meteorStream dt{
    width: 40px;
}
.nightskyContents dl.meteorStream dd{
    width: 490px;
	text-align:left;
	text-indent:1em;
}
.nightskyContents dl dd img{
	vertical-align:middle;
}
.nightskyContents p {
	background:rgba(11,28,54,0.5);
	padding:20px;
	line-height:1.7!important;
	margin:0 auto 30px auto;
}
.nightskyContents .box-bn {
    margin: 0 auto;
    width: 400px!important;
    background: rgba(255,255,255,0.2);
    border: 1px solid #fff;
    border-radius: 4px;
}
.nightskyContents .box-bn:hover {
    background: rgba(109,144,230,0.8);
    border: 1px solid #6d90e6;
}
.nightskyContents .box-bn > p {
	background:none;
    padding: 0!important;
	line-height:normal!important;
    letter-spacing: 0;
    font-size: 14px;
}
.nightskyContents .box-bn > p > a{
    color: #fff!important;
    text-decoration: none;
    display: block;
    padding: 15px;
}
/*2カラムの場合*/
.findBox{
	background:#F9F4FF url(/lp/nightsky/img/img-ferry.png) no-repeat 520px 15px;
	border:#fff 1px solid;
	margin:0 auto 30px auto;
	padding:20px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}
.findBox h3{
	border:none;
	padding:0;
	margin:0 0 20px 0;
	color:#075895;
	font-size:200%;
}
.findBox p{
	background:none;
	margin:0;
	padding:0;
	color:#075895;
}
/*上下の場合*/
.findBox2{
	background:#F9F4FF url(/lp/nightsky/img/img-ferry.png) no-repeat 520px 15px;
	border:#fff 1px solid;
	margin:0 auto 30px auto;
	padding:20px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}

.findBox2 h3{
	border:none;
	padding:0;
	margin:0 0 20px 0;
	color:#075895;
	font-size:200%;
	text-align:left;
}

.findBox2 p{
	background:none;
	margin:10px 0 0 0;
	padding:0;
	color:#075895;
	text-align:left;
}
.findBox2 .center{
	text-align:center;
}
.attentionBox{
	background:url(/lp/nightsky/img/img-attention-bg.gif);
	border:#fff 1px solid;
	margin:0 auto 20px auto;
	padding:20px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}
h3.attentionTtl{
	border:none;
	padding:0 0 0 20px;
	margin:0 0 20px 0;
}
ul.attentionList{
	margin:0 0 20px 20px;
	padding:0;
}
ul.attentionList li{
	background:url(/lp/nightsky/img/img-attention-icon.png) no-repeat;
	color:#212A43;
	margin:0 0 10px 0;
	padding:0 0 0 20px;
	list-style:none;
}
.profile{
	width:126px;
}
.meteorStreamBox{
	width:630px;
	background:rgba(255,255,255,0.2);
	border:#fff 1px solid;
	margin:0px auto 30px auto;	
	color:#fff;
	padding:20px;
}
.meteorStreamBox p{
	width:630px;
	background:none;
	padding:0;
	margin:0;
}
.meteorStreamBox h4{
	font-size:130%;
	margin:0 0 20px 0;
	padding:0;
}


@media only screen and (max-width: 750px) {
/*kokokara*/
    .nightskyBox > h2{
        text-align: center;
        width: 100%!important;
        height: auto!important;
        padding-top: 1em!important;
        margin-bottom: 0!important;
    }
    .nightskyContents > h3, .nightskyBox > h3{
        font-size: 20px;
    }
    ul#teacher-profile{
    display: flex;
    align-items:flex-start;
    flex-basis: 100%;
    padding-bottom: 30px;
    }
    ul#teacher-profile li{
    width: 100%;
    padding: 10px;
    display: flex;
    }
    ul#teacher-profile li img{
    margin-right: 15px;
    }
    ul#teacher-profile li .profile-txt strong{
        font-size: 16px;
    }
    ul#teacher-profile li .profile-txt .txt-small{
        font-size: 14px;
    }
    ul#teacher-profile li .profile-txt a.r-txt{
        font-size: 14px;
    }
    ul#teacher-profile li .profile-txt a.arrow-o02{
        font-weight: bold;
    }
    .nightskyContents{
        padding: 10px!important;
    }
    .starBox{
        width: 100%!important;
        margin: 0!important;
        padding: 0!important;
    }
    .starBox img{
        max-width: 100%!important;
        height: auto;
    }
.nightskyBox{
    background: url(/lp/nightsky/img/img-ns-bg2.png) repeat-y #221F1A;
    margin: -10px -10px -14px -10px!important;
}
.nightskyContents p {
	background:rgba(11,28,54,0.7);
    padding: 15px!important;
	line-height:1.8!important;
    letter-spacing: 0;
    font-size: 14px;
}
.nightskyContents .box-bn {
    margin: 0 auto 15px auto;
    width: 80%!important
}
.nightskyContents .box-bn > p {
	background:none;
    padding: 0!important;
	line-height:normal!important;
    letter-spacing: 0;
    font-size: 13px;
}
    .nightskyContents dl{
        width: 100%!important;
        padding: 0!important;
        border: none!important;
        background: none!important;
        height: auto!important;
        text-align: center;
    }
    .nightskyContents dl dt{
        width: 100%!important;
        float: none!important;
        padding-left: 0!important;
    }
    .nightskyContents dl dd{
        float: none;
        background:rgba(11,28,54,0.4);
        padding: 2px!important;
        border: 1px solid #fff;
        font-size: 10px;
        line-height: 27px;
        display: inline-block;
        width: 29%;
        letter-spacing: 0;
    }
    .attentionBox{
        padding: 10px!important;
    }
    h3.attentionTtl img{
        max-width: 100%!important;
        height: auto;
        padding: 0!important;
    }
    .nightsky article h3{
      padding: 0!important;
    }
    ul.attentionList{
        margin: 0!important;
    }
.starBox {
	border:none;
  }
.findBox{
	border:none;
    padding: 14px!important;
}
    .findBox p{
        background: none;
        padding: 0!important;
    }
    .findBox h3{
        font-size: 160%;
    }
#monthly h2{
    color: #000;
    font-size: 20px!important;
    height: auto;
}
#monthly ul{
    display: flex;
    flex-wrap: wrap;
    height: auto;
    margin: 0;
}
#monthly ul li{
    font-size: 12px;
    width: calc(100% / 6.5);
}
#monthly ul li a{
margin: 0 auto 10px auto;
    }
#meteostream{
    height: auto;
    }
#meteostream h2{
    color: #000;
    font-size: 20px!important;
    height: auto;
    margin-top: 0!important;
}
#meteostream ul{
    display: flex;
    flex-wrap: wrap;
    height: auto;
}
#meteostream ul li{
    width: 48%;
}
#meteostream ul li a{
    font-size: 12px;
    padding: 8px;
    display: block;
    text-align: center;
    }
#meteostream li:last-child{
    margin-bottom: 1em!important;
}
.nightskyContents dl.meteorStream dd {
    width: 90%;
    text-align: left;
    text-indent: 1em;
}
    #contents{
        margin-bottom: -20px!important;
    }
/*kokomade*/
}

@media only screen and (max-width: 374px) {
.nightskyContents dl dd {
    width: auto;
}
}