@charset "UTF-8";
/* CSS Document */

/*^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
/* font-size の指定一覧/*

12px:75%
13px:77%
14px:85%
15px:93% 
16px:100%
17px:108%
18px:116%
19px:123.1%
20px:131%
21px:138.5%
22px:146.5%
23px:153.9%
24px:161.6%
25px:167%
26px:174%
27px:182%
28px:189%
29px:197%

/*^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/

/* cloud and land ロゴ使用の為の指定 */
@font-face {
    font-family: 'cl_logo1';
    src:    url('../fonts/cl_logo1.eot?cwttg0');
    src:    url('../fonts/cl_logo1.eot?cwttg0#iefix') format('embedded-opentype'),
        url('../fonts/cl_logo1.ttf?cwttg0') format('truetype'),
        url('../fonts/cl_logo1.woff?cwttg0') format('woff'),
        url('../fonts/cl_logo1.svg?cwttg0#cl_logo1') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* ====================================================================== */
/* 共通部分の指定 */
/* ====================================================================== */

html{
  height:100%;/* footer固定用の指定１ */
}
body{
  height:100%;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size:13px;
  line-height:1.5;
  font-size:16px;
}

#wrapper {
  position:relative;/* footer固定用の指定２ */
  width:100%;
  max-width:916px;
  height:100%;
  min-height:100%; /* footer固定用の指定３ */
  margin:0 auto;
  /* old IE用指定 */
  *height:auto;
  *height:100%;
  overflow:hidden;
}

/* === ヘッダー&ナビの指定 ===*/
header {
  margin:0 0 12px;
  
  background:url(../img/moon_illust_01.png);
  /*background-size:22.5% auto;*/
  background-size:74px auto;
  background-position:60% 80%;
  background-repeat:no-repeat;
}
button {
  float:right;
}
h1 {
  float:left;
  margin:2em auto 0.5em;
  text-align:center;
}
h1 a{
  display:block;
}
h1 a img{
  width:90%;
  height:auto;
  vertical-align:bottom;
}

nav{
  margin:0 0 24px;
}
ul.g_nav {
  width:100%;
  margin:0;
  padding:0;
  display:block;
  overflow:hidden;
  position:relative;
  z-index:9999;
}
ul.g_nav li a {
  display: block;
  width: 100%;
  height:100%;
  padding:0.7em 0;
  color:#006;
  background:rgba(94,183,232,0.5);/* メイン空色 #5EB7E8 */
  text-align:center;
  font-family: 'IM Fell French Canon', serif;
  font-style:italic;
}
ul.g_nav li.cl a{/* C＆Lへのリンクロゴ */
  font-family:'cl_logo1';
  font-style:normal;
  font-size:42px;
  padding:0.15em 0;
  color:#333;
}
ul.g_nav li a:hover{
  background:#627080;
  color:#fff;
}

#main {
  width:100%;
  height:100%;
  /*padding-bottom:48px; footer固定用の指定５ 重なった時の逃げ。フッター高さと同じ */
}

footer{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:48px;
  text-align:center;
  background:#fff;
}
footer p{
  margin:12px 0 12px;
  font-family: 'IM Fell French Canon', serif;
  font-size:75%;
  color:#888;
}

.sky{
  color:#5EB7E8;
}
.pink{
  color:#F66;
}
.center{
  text-align:center;
}
.left{
  text-align:left;
}
.right{
  text-align:right;
}
.small{
  font-size:85%;
}

h1.invs{
  visibility:hidden;
  display:none;
}

br.sml_visb{
  visibility:visble;
  display:inline;
}
br.sml_invs{
  visibility:hidden;
  display:none;
}

.dot:after{
	content:" ";
	display:block;
	width:9px;
	height:9px;
	text-align:center;
	margin:36px auto;
	background:#85C1DF/*#5EB7E8*/;
	border-radius:100%;
}



a.link_list{
  line-height:3;
}
a.link_list:link,
a.link_list:visited{
  color:#5EB7E8;
}

/*@media screen and (min-width: 415px) {
  
}*/



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


/* === ワイド画面のナビの指定 ===*/

#wrapper{
  background:url(../img/moon_illust_01.png);
  background-position:center 36px;
  background-repeat:no-repeat;
}

header{
  width:24.672489%;
  float:left;
  overflow:hidden;
  margin:110px 0 0;
  background:none;
}
h1{
  margin:0 0 0 20.353982%;
}
h1 a{
  margin:0 0 0 5%;
}
h1 a img{
  width:100%;
}

nav#nav{
  box-sizing:border-box;
  width:75.327511%;
  padding:0 0 0 1.5%;
  float:right;
  overflow:hidden;
  margin:110px 0 24px;
}

ul.g_nav {
  width:100%;
  margin:0px 0 0;/* top 36pxだった */
  padding:0;
  display:block;
  overflow:hidden;
  z-index:9999;
}

ul.g_nav li{
  float:left;
  width:17.25%;/* 15.76087% */
  height:56.6px;
  font-size:1em;
  background:none;
}
ul.g_nav li a {
  padding:0;
  line-height:56.6px;
  color:#333;
  background:none;
}
ul.g_nav li.cl{
  width:30%;/* 30.706522% */
}
ul.g_nav li.cl a{/* C＆Lへのリンクロゴ */
  box-sizing:border-box;
  padding:0 27% 0 0;
  line-height:1em;
  text-align:right;
}
ul.g_nav li a:link,
ul.g_nav li a:visited{
  color:#333;
}
ul.g_nav li a:hover{
  background:rgba(94,183,232,0.2);/* メイン空色 #5EB7E8 */
  color:#aaa;
}

footer p{
  font-size:75%;

}


br.sml_visb{
  visibility:hidden;
  display:none;
}
br.sml_invs{
  visibility:visible;
  display:inline;
}

}
/* end min-width 700px */