@charset utf-8;

html {
font-size:62.5%;
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

body {
-webkit-text-size-adjust:100%;
margin-right:auto;
margin-left:auto;
height:100%;
font-size:1.4rem;
}

img {
max-width:100%;
}

#wrap {
width:100%;
position:relative;
height:auto!important;
min-height:100%;
margin-right:auto;
margin-left:auto;
}
/* ----------------------------------------
   ヘッダーレイアウト
---------------------------------------- */
header h1 {
left:0;
top:10px;
z-index:5;
height:auto;
position:absolute;
width:100%;
}

header h1 img {
position:absolute;
max-width:100%!important;
height:auto!important;
margin-left:27%;
}
/* ----------------------------------------
   スライドショーレイアウト
---------------------------------------- */
#slide_show {
display:block;
width:100%;
height:auto;
margin-bottom:20px;
top:0;
position:relative;
z-index:1;
}

#wrapper {
display:block;
width:100%;
height:auto;
position:relative;
top:0;
left:0;
-webkit-box-shadow:0 4px 6px -6px #999;
-moz-box-shadow:0 4px 6px -6px #999;
box-shadow:0 4px 6px -6px #999;
}

#carousel img {
height:100%;
width:auto;
display:block;
float:left;
position:relative;
z-index:1;
}

#carousel {
height:auto;
min-height:100px;
position:relative;
top:auto;
left:0;
}

#pager {
position:absolute;
top:95%;
left:50%;
margin-left:-90px;
z-index:2;
}

#pager a {
border:1px solid #fff;
border-radius:10px;
display:inline-block;
width:10px;
height:10px;
margin:0 5px 0 0;
}

#pager a:hover {
background-color:rgba(255,255,255,0.5);
}

#pager a span {
display:none;
}

#pager a.selected {
background-color:#fff;
}

#content {
height:auto;
margin-right:auto;
margin-left:auto;
max-width:1200px;
width:1200px;
position:relative;
padding-bottom:500px;
overflow:hidden;
z-index:1;
}
/* ----------------------------------------
   ナビゲーションレイアウト
---------------------------------------- */
nav {
display:block;
width:1200px;
position:absolute;
margin-right:auto;
margin-left:auto;
overflow:hidden;
z-index:2;
}

nav img {
max-width:100%!important;
height:auto!important;
width:150px;
}

nav ul {
position:relative;
left:50%;
float:left;
}

nav div #float .float_li {
width:150px;
font-size:12px;
position:relative;
left:-50%;
display:block;
float:left;
}

nav ul.accordion .float_li:hover {
cursor:pointer;
}

nav #gallery_btn {
text-align:center;
background:url(../images/btn_01.png) no-repeat;
}

nav #scene_btn {
text-align:center;
background:url(../images/btn_02.png) no-repeat;
}

nav #flow_btn {
text-align:center;
background:url(../images/btn_03.png) no-repeat;
}

nav #menu_btn {
text-align:center;
background:url(../images/btn_04.png) no-repeat;
}

nav #studio_btn {
text-align:center;
background:url(../images/btn_05.png) no-repeat;
}

nav #contact_btn {
text-align:center;
background:url(../images/btn_06.png) no-repeat;
}
/* ----------------------------------------
   accordionの中身
---------------------------------------- */
nav ul.accordion a {
text-decoration:none;
}

nav ul.accordion li ul {
width:150px;
background:#fff;
float:none;
left:0;
padding:10px 0;
}

nav ul.accordion li li {
font-size:12px;
background:#fff;
}

nav ul.accordion li li a {
display:block;
width:150px;
color:#b9b9b9;
padding:7px 5px 7px 20px;
}

nav ul.accordion li li a:hover {
color:#690;
}
/* ----------------------------------------
   ボトムナビレイアウト
---------------------------------------- */
#bottom_navi {
position:relative;
z-index:1;
margin-top:60px;
overflow:hidden;
max-width:1000px;
width:100%;
margin-right:auto;
margin-left:auto;
}

#bottom_navi h2 {
margin-right:auto;
margin-left:auto;
width:100%;
text-align:center;
margin-bottom:20px;
}

#container {
margin-right:auto;
margin-bottom:0;
margin-left:auto;
max-width:1000px;
width:100%;
min-width:360px;
padding-left:20px;
padding-top:10px;
}

#container .post .flame {
height:220px;
width:132px;
border:3px solid #FFF;
border-radius:4px;
display:inline-block;
-webkit-box-shadow:0 0 10px -5px rgba(0,0,0,0.8);
-moz-box-shadow:0 0 10px -5px rgba(0,0,0,0.8);
box-shadow:0 0 10px -5px rgba(0,0,0,0.8);
overflow:hidden;
}

#container .post .flame_big {
height:220px;
width:284px;
text-align:center;
border:3px solid #FFF;
border-radius:4px;
display:inline-block;
-webkit-box-shadow:0 0 10px -5px rgba(0,0,0,0.8);
-moz-box-shadow:0 0 10px -5px rgba(0,0,0,0.8);
box-shadow:0 0 10px -5px rgba(0,0,0,0.8);
overflow:hidden;
}

#container .post {
margin-bottom:10px;
position:relative;
}
/* ----------------------------------------
   ライフフォトレイアウト
---------------------------------------- */
#content #life_photo {
width:auto;
margin-right:auto;
margin-left:auto;
text-align:center;
}
/* ----------------------------------------
   トピックレイアウト
---------------------------------------- */
#topics {
display:block;
position:relative;
height:auto;
text-align:left;
}

#container .post .flame #topics h2 {
width:auto;
height:25px;
margin-top:10px;
margin-left:-35px;
}

#container .post .flame #topics dl {
width:95%;
border-bottom-width:2px;
border-bottom-style:dotted;
border-bottom-color:#666;
font-size:1.2rem;
color:#666;
text-align:left;
display:block;
padding-top:10px;
padding-bottom:10px;
line-height:1.7rem;
margin-right:auto;
margin-left:auto;
}

#topics a {
color:#666;
text-decoration:underline;
display:block;
}

#topics a:hover {
color:#999;
text-decoration:underline;
}
/* ----------------------------------------
   フッターレイアウト
---------------------------------------- */
footer {
height:auto;
margin-right:auto;
margin-left:auto;
display:block;
text-align:center;
background-color:#F3F3F3;
width:100%;
position:absolute;
bottom:0;
font-size:1.2rem;
color:#666;
z-index:1;
overflow:hidden;
}

#footer_float {
height:auto;
position:relative;
text-align:left;
margin-top:20px;
width:980px;
margin-right:auto;
margin-left:auto;
}

#footer_float #float_back {
display:block;
width:980px;
}

footer ul li span {
font-weight:700;
border-top-width:1px;
padding-top:10px;
padding-bottom:10px;
display:block;
}

#footer01 {
float:left;
width:14%;
height:auto;
position:relative;
border-bottom-width:1px;
border-bottom-style:dashed;
border-bottom-color:#999;
margin-right:1%;
margin-left:2%;
}

#footer02 {
float:left;
width:25%;
height:auto;
position:relative;
border-bottom-width:1px;
border-bottom-style:dashed;
border-bottom-color:#999;
margin-right:1%;
}

#footer03 {
width:14%;
height:auto;
position:relative;
float:left;
border-bottom-width:1px;
border-bottom-style:dashed;
border-bottom-color:#999;
margin-right:1%;
}

#footer04 {
width:15%;
height:auto;
position:relative;
border-bottom-width:1px;
border-bottom-style:dashed;
border-bottom-color:#999;
float:left;
margin-right:1%;
}

#footer05 {
width:12%;
height:auto;
position:relative;
border-bottom-width:1px;
border-bottom-style:dashed;
border-bottom-color:#999;
float:left;
margin-right:1%;
}

#footer06 {
width:12%;
height:auto;
position:relative;
border-bottom-width:1px;
border-bottom-style:dashed;
border-bottom-color:#999;
float:left;
}

footer li#home_icon {
background-image:url(../images/ico_01.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#topics_icon {
background-image:url(../images/ico_02.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#gallery_icon {
background-image:url(../images/ico_03.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#life_icon {
background-image:url(../images/ico_04.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#scene_icon {
background-image:url(../images/ico_06.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#flow_icon {
background-image:url(../images/ico_05.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#menu_icon {
background-image:url(../images/ico_07.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#about_icon {
background-image:url(../images/ico_08.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

footer li#contact_icon {
background-image:url(../images/ico_09.png);
background-repeat:no-repeat;
background-position:0 50%;
padding-left:35px;
border-top-width:1px;
border-top-style:dashed;
border-top-color:#999;
}

#menu_floatleft {
display:block;
float:left;
}

#menu_floatright {
display:block;
float:right;
}

footer .padding {
padding-top:5px;
padding-bottom:5px;
margin-left:10px;
}

#footer_text {
clear:both;
line-height:1.5em;
text-align:right;
width:980px;
position:relative;
}

#footer_text span {
font-weight:700;
font-size:14px;
}

small {
height:100px;
display:block;
text-align:right;
width:100%;
margin-top:10px;
position:relative;
}

#back-top {
position:fixed;
bottom:300px;
right:0;
}

#back-top a {
width:120px;
display:block;
text-align:center;
text-transform:uppercase;
text-decoration:none;
outline:none;
filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
position:relative;
z-index:5;
}

#back-top a:hover {
filter:alpha(opacity=50);
-moz-opacity:0.5;
opacity:0.5;
}

#back-top span {
width:120px;
height:100px;
display:block;
margin-bottom:7px;
background-image:url(../images/scroll_navi.png);
background-repeat:no-repeat;
background-position:center center;
}

.clearfix:after {
content:".";
display:block;
height:0;
font-size:0;
clear:both;
visibility:hidden;
}

* html .clearfix {
height:1%;
}

nav .accordion_head,nav .accordion_top {
text-indent:-9999px;
display:block;
height:42px;
width:150px;
padding:0;
}

.modules,footer #footer_float ul li,.clearfix {
display:block;
}

#container .post a img,#content #life_photo a img {
height:220px;
width:auto;
-webkit-transition:.3s ease-in-out;
-moz-transition:.3s ease-in-out;
-o-transition:.3s ease-in-out;
transition:.3s ease-in-out;
}

#container .post a img:hover,#content #life_photo a img:hover {
opacity:0.6;
filter:alpha(opacity=60);
-moz-opacity:0.6;
}