/*----------------------------------------------------------------------------
******************************************************************************
base
******************************************************************************
----------------------------------------------------------------------------*/
/* ==== base === */
body { background: url(../images/body-bg1.jpg) repeat-x top center #181B1F; }
/* ==== header === */
.hd-con {
	margin-left: auto;
	margin-right: auto;
	padding-top: 20px;
	position: relative;
	width: 960px;
}
.hd-con h1 { 
	margin-top: 10px;
	float: left;
}
.hd-cont{
	background-color: rgba(0,0,0,0.6);
	-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;
	float: right;
	padding: 20px;
	text-align: center;
	width: 180px;
}
.hd-cont .ttl{
	font-size: 16px;
	margin-bottom: 5px;
}
.hd-cont .mail img{
	height: auto;
	width: 100%;
}
.hd-cont .txt{ font-size: 16px; font-weight: bold;}
/* ==== global nav === */
.gnav-bg { }
.gnav-con {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}
.gnav-con li {
	float: left;
	width: 160px;
}
.gnav-con ul > li > a {
	display: block;
	height: 80px;
	overflow: hidden;
	padding-top: 80px;
}
.gnav-btn1 { background: url(../images/gnav-btn1.png); }
.gnav-btn2 { background: url(../images/gnav-btn2.png); }
.gnav-btn3 { background: url(../images/gnav-btn3.png); }
.gnav-btn4 { background: url(../images/gnav-btn4.png); }
.gnav-btn5 { background: url(../images/gnav-btn5.png); }
.gnav-btn6 { background: url(../images/gnav-btn6.png); }
.gnav-btn1:hover, .gnav-btn1-active { background: url(../images/gnav-btn1-ov.png); }
.gnav-btn2:hover, .gnav-btn2-active { background: url(../images/gnav-btn2-ov.png); }
.gnav-btn3:hover, .gnav-btn3-active { background: url(../images/gnav-btn3-ov.png); }
.gnav-btn4:hover, .gnav-btn4-active { background: url(../images/gnav-btn4-ov.png); }
.gnav-btn5:hover, .gnav-btn5-active { background: url(../images/gnav-btn5-ov.png); }
.gnav-btn6:hover, .gnav-btn6-active { background: url(../images/gnav-btn6-ov.png); }
/* ==== content === */
.con-con {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}
.context { word-wrap: break-word; }
/* a */
.context a img:hover {
	opacity: 0.5;
	filter: alpha(Opacity=50);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
/* dl */
.context dl {
	margin-bottom: 20px;
	margin-top: 20px;
}
.context dl dt, .context dl dt {
	margin-bottom: 10px;
	margin-top: 10px;
}
/* h */
.context h1 { }
.context h2 {
	font-size: 36px;
	font-weight: normal;
	margin-bottom: 20px;
}
.context h3 {
	margin-bottom: 20px;
	margin-top: 30px;
}
.context h4 {
	margin-bottom: 10px;
	margin-top: 20px;
}
/* hr */
.context hr {
	border: none;
	border-top: 1px dotted rgba(0, 0, 0, 1);
}
/* iframe */
.context iframe { max-width: 100%; }
/* img */
.context img {
	max-width: 100%;
	height: auto;
}
/* ol */
.context ol {
	margin-bottom: 10px;
	margin-left: 1.5em;
	margin-top: 10px;
}
.context ol li { margin-left: 5px; }
/* ol */
.context p { margin-bottom: 10px; }
/* ul */
.context ul {
	list-style-type: disc;
	margin-bottom: 20px;
	margin-left: 1.5em;
	margin-top: 20px;
}
.context ul li { margin-left: 5px; }
/* table */
.context table {
	margin-bottom: 10px;
	margin-top: 10px;
}
.main-con { padding-top: 30px; }
.sub-con { }
.sub-con li {
	display: inline-block;
	margin-right: 10px;
}
.sub-nav-con li:nth-last-of-type(1) {
 margin-right: 0;
}
.sub-con li a {
	background: #22262D;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color: #FFF;
	display: inline-block;
	font-size: 12px;
	padding: 10px;
	text-decoration: none;
}
.sub-con li a:hover, .sub-con li a.active { background: #464E59; }
/* ==== footer === */
.ft-con {
	padding-bottom: 30px;
	padding-top: 50px;
	text-align: center;
}
.ft-con .copyright { color: #666; }
.ft-cont {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 20px;
}
.ft-cont .ttl {
	font-size: 14px;
	font-weight: bold;
	margin-right: 16px;
}
/* ==== pagetop === */
.pagetop {
	bottom: 30px;
	display: table;
	height: 5em;
	position: fixed;
	right: 30px;
	width: 5em;
	z-index: 100;
}
.pagetop span {
	background-color: #333;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	color: #FFF;
	cursor: pointer;
	display: table-cell;
	font-size: 0.5em;
	text-align: center;
	text-decoration: none;
	text-align: center;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	vertical-align: middle;
}
.pagetop span:hover {
	filter: alpha(opacity=80);/*IE*/
	opacity: 0.8;
}
/*----------------------------------------------------------------------------
******************************************************************************
original
******************************************************************************
----------------------------------------------------------------------------*/
/* ==== Home === */
.home-hd-area1{
	float: left;
	width: 740px;
}
.home-hd-area1 h1{
	float: none;
}
.home-hd-con { height: auto; }
.home-slide-con li {
	float: left;
	width: 16.6%;
}
.home-slide-con li img {
	height: auto;
	width: 100%;
}
/* ==== Other === */
.album-h2 {
	background: url(../images/aubum-h2-bg.png) repeat-x bottom center;
	border: 1px solid #111;
	margin-bottom: 20px;
	padding: 20px;
}
.album-emot-h2{
	background-image: url(../images/aubum-emot-h2-bg.png);
}
.album-pale-h2{
	background-image: url(../images/aubum-pale-h2-bg.png);
}
.album-h2 h2 span.cap {
	font-size: 16px;
	margin-left: 10px;
}
.album-box {
	background-color: #121417;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	float: left;
	height: 200px;
	margin: 0 10px 20px 0;
	overflow: hidden;
	width: 470px;
}
.album-box:nth-child(odd) {
	margin-left: 10px;
	margin-right: 0;
}
.album-box:nth-child(odd):after {
	clear: both;
}
.album-box-thum{
	float: left;
	overflow: hidden;
	width: 200px;
}
.album-box-thum img{
	height: 200px;
	max-width: none;
	width: auto;
}
.album-box-txt{
	float: left;
	padding: 20px 20px 0px 20px;
	width: 270px;
}
.album-box-txt .ttl{
	font-size: 20px;
	margin-bottom: 10px;
}
.album-box-txt p{
	font-size: 13px;
	line-height: 1.3em;
}
.album-box-txt .led{
	color: #CCC;
	font-size: 11px;
	line-height: 1.2em;
}
/*----------------------------------------------------------------------------
******************************************************************************
responsive
******************************************************************************
----------------------------------------------------------------------------*/
.sp-hd-btn { display: none; }
@media screen and (max-width: 780px) {
/* ==== hd === */
.hd-con {
height: auto;
padding: 20px;
width: 100%;
}
.hd-con h1{
float: none;
margin-top: 0px;
text-align: center;
}
.hd-con h1 img {
height: auto;
max-width: 100%;
}
.hd-cont{
float: none;
padding: 10px;
width: 100%;
}
.hd-cont .ttl{
font-size: 12px;
font-weight: bold;	
}
.hd-cont .mail img{
width: 160px;	
}
/* ==== gnav === */
.gnav-con {
display: none;
border-left: 1px solid rgba(255, 255, 255, 0.1);
border-top: 1px solid rgba(255, 255, 255, 0.1);
width: 100%;
}
.gnav-con li {
float: left;
width: 50%;
}
.gnav-con ul > li > a {
background: none!important;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
border-right: 1px solid rgba(255, 255, 255, 0.1);
color: #FFF;
height: auto;
padding: 20px 5px;
text-align:center;
text-decoration: none;
}
.gnav-con ul > li > a:hover, .gnav-con ul > li > a[class $='active'] {
background: #384049!important;
}
/* ==== content === */
.con-con {
width: 100%;
padding: 20px 20px 0;
}
.contents {
width: 100%;
margin: auto;
padding: 30px;
}
.context {
font-size: 120%;
line-height: 26px;
}
/* h */
.context h1 {}
.context h2 { 
font-size: 1.8em;
font-weight: bold; 
line-height: 1.3em; 
}
.context h3 {}
.context h4 {}
/* ol,ul */
.context ul {
list-style-type: disc;
}
.context ol li, .context ul li {
line-height: 22px;
}
/* table */
.context table {
line-height: 22px;
}
/* dl */
.context dl {
line-height: 22px;
}
/* img */
.context img {
max-width: 100%;
height: auto;
}
.main-con { padding-top: 0px; }
.sub-con li {
margin-bottom: 10px;
}
/* ==== ft === */
.ft-con {
padding: 20px 10px;
}
/* ==== pagetop === */
.pagetop {
bottom: 10px;
height: 50px;
right: 10px;
width: 50px;
}

/* ==== home === */
.home-hd-area1{
float: none;
margin-bottom: 10px;
width: 100%;
}
.home-hd-con {
height: auto;
}
.home-hd-con h1 {
margin-bottom: 10px;
}
.home-hd-desc {
text-align: left;
}

/* ==== Other === */
.album-h2 h2 { margin-bottom: 0px; }
.album-h2 p{
font-size: 12px;
line-height: 1.3em;
}
.album-box {
float: none;
height: auto;
margin: 0 0 10px 0!important;
width: 100%;
}
.album-box-thum{
float: left;
width: 35%;
}
.album-box-thum img{
height: auto;
width: 100%;
}
.album-box-txt{
float: left;
padding: 10px;
width: 65%;
}
.album-box-txt .ttl{
font-size: 20px;
margin-bottom: 10px;
}
.album-box-txt p{
font-size: 13px;
line-height: 1.3em;
}
.album-box-txt .led{
color: #CCC;
font-size: 11px;
line-height: 1.2em;
}

/* ==== sp === */
.sp-hd-btn {
display: block;
margin-bottom: 20px;
text-align: center;
}
.sp-hd-btn span {
background-color: #FFF;
color: #333;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
cursor: pointer;
display: inline-block;
font-size: 12px;
font-weight: bold;
padding: 3px 20px;
text-align:center;
}
.sp-hd-btn span:hover, .sp-hd-btn span.active {
background-color: #181B1F;
border: 1px solid #FFF;
color: #FFF;
}
}

@media screen and (max-width: 540px) {
/* ==== gnav === */
.gnav-con li {
width: 100%;
}
/* ==== sub === */
.con-con {
padding: 10px 10px 0;
}
/* ==== sub === */
.sub-con li {
margin-right: 5px;
}
.sub-con li a {
padding: 10px 5px;
}
/* ==== pagetop === */
.pagetop {
height: 40px;
width: 40px;
}
/* ==== other === */
.album-box-thum{
float: none;
width: 100%;
}
.album-box-txt{
float: none;
padding: 10px;
width: 100%;
}
.album-box-txt .ttl{
font-size: 16px;
}
}