html,body{
  color:#000000;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size:16px;
  margin:0;
  padding:0;
  word-break:break-strict;
  word-wrap:break-word;
  width: 100%
}

body {
  max-width: 1920px;
  margin: 0 auto;
}

h1, h2, h3, h4, h5, h6 {
  display: block;
  /*  line-height: 1em;*/
  margin: 0;
  padding:0;
}

a:link{ color:#2998CF}
a:visited{color: #2998CF}
a{ text-decoration: none; }
a:hover{ text-decoration: underline; }

h2{
  background-color: #2998CF;
  color: #fff;
}

p{
  margin: 0 0 1em 0;
  padding:0;
  line-height: 2em
}
header{
  background:url(../images/bg-header.jpg) no-repeat top center;
}
#remote{ color: #fff;}
#remote p{ margin: 0 }
#remote a{
	color: #fff;
	text-decoration: none;
	font-size: 90%;
}
#logo{
	display: block;
	margin:0 auto;
}
#global,footer{
	background: #2998CF;
}

#global{
	overflow: hidden;
}

#global ul,
#global ul li{
	list-style: none;
	padding:0;
}

#global ul{ margin:0 auto; }

#global li a{
  color: #ffffff;
  text-decoration: none;
}

#global li a:before{
  color: #fff;
  /*content: "&#9654;&nbsp;";*/
  content: "\25B6\00A0";
}

.container{
  margin: 0 auto;
  overflow: hidden;
}
.container *{
	max-width: 100%
}

body > section,
body > section .container{ position: relative;}

footer{
	color: #fff;
	text-align: center;
	padding: 60px 0;
	margin-top: 30px;
}

footer .copyright{ font-size: 90%;}

footer .footer-bnr img{
	margin: 15px 10px 5px 10px;
	padding: 10px;
	background: rgba(255,255,255,0.6);
	border-radius: 10px;
}

/* ■■ここからPC限定■■ */
@media all and (min-width: 769px),print{
	body>section{
		padding:0 0 30px 0;
		margin-top: 30px
	}

	h2{
		margin-bottom: 30px;
		font-size: 200%;
	}

	h2 span{
		border-left: 5px solid #fff;
		display: block;
		font-size: 140%;
		margin:0 auto;
		padding:20px 0 20px 15px;
		width: 940px;
	}

	#remote{text-align: right;}
	#introduction{ margin-top: 0 }

	#global {padding: 10px 0 0 0}

	.container,
	#global ul{ width: 940px;}

	#global li {
		float: left;
		font-size: 105%;
		font-weight: normal;
		position: relative;
		margin:0 30px 10px 0;
	}

}


/* ■■ここからスマホ限定■■ */
@media only screen and (max-width: 768px){
	html,body{ font-size:14px;}
	body img{max-width: 100%}
  h2{ padding:20px 10px; }
 	.header + *{ padding-top: 80px}

  #logo{
    display: block;
    margin:0 auto;
    width: 320px
  }
  .container{
    padding-right:10px;
    padding-left: 10px;
  }

  #remote p{
    text-align: right;
    margin:0 0 10px 0;
  }

	header{ 
    overflow: hidden;
    height: 190px;
  }
  #menuBtn{
    border:1px solid #fff;
    color: #fff;
    cursor: pointer;
    padding:5px 10px;
    margin: 0 auto 10px auto;
    text-align: center;
    width: 120px
  }

  #global{
		background: rgba(9, 53, 95, 0.8);
    clear: both;
    display: none;
    overflow: scroll;
    position: fixed;
    padding: 10px;
    top: 189px;
    left: 0;
    right: 0;
    height:480px;
    z-index: 9999;
  }


  #global li{
    border-top:1px solid #fff;
  }
  #global li:last-of-type{
    border-bottom:1px solid #fff;
  }
  #global li a{
		display: block;
		padding:10px 0;
		width: 100%;
	}
  #global h2{
    color: #fff;
    padding:0;
    margin:0;
  }

  #global ul{
    margin: 10px 0;
    padding-bottom: 60px;
    width: 100%;
  }


}


/*2カラムレイアウト*/
.col-2{
	overflow: hidden;
}
@media all and (min-width: 769px),print{
	.col-2 article{
		float: left;
		width: 440px;
	}
	.col-2 article:nth-of-type(2n){
		float: right;
	}
	.col-2 article:nth-of-type(2n+1){
		clear: both;
	}
}

/* リンクボタン */
.btn-small {
	padding:7px 40px 28px 20px;
	background-position: 180px center;
	width: 160px;
}
@media all and (min-width: 769px),print{
	.clearfix .btn {
		float: left;
		margin: 5px 5px;
	}
}

	
/* grid表示 */
@media all and (min-width: 769px),print{
	.clearfix [class^="grid"] {
		display: block;
		float: left;
		box-sizing: border-box;
		padding-right: 30px;
	}
	.clearfix .grid_01 { width:   8.33%; }
	.clearfix .grid_02 { width:  16.66%; }
	.clearfix .grid_03 { width:  25%; }
	.clearfix .grid_04 { width:  33.33%; }
	.clearfix .grid_05 { width:  41.66%; }
	.clearfix .grid_06 { width:  50%; }
	.clearfix .grid_07 { width:  58.33%; }
	.clearfix .grid_08 { width:  66.66%; }
	.clearfix .grid_09 { width:  75%; }
	.clearfix .grid_10 { width:  83.33%; }
	.clearfix .grid_11 { width:  91.66%; }
	.clearfix .grid_12 { width: 100%; }
}


dt { font-weight: bold; }
dd { margin-left: 14px; }
@media only screen and (max-width: 768px){
	dd { margin-left: 12px; }
}
