/*
Template:minimaga
Theme Name:minimaga_child
Site:Zeppet
*/

/* ***************************************************************** 
*	基本設定
* ***************************************************************** */

body {
height: 100%;
font-size: 1.4rem;
font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
background: #161616;
color: #f2f5f8;
line-height: 1.8;
word-wrap:break-word;
overflow-wrap:break-word;
}

* {
margin:0;
padding:0;
}



/* *****************************************************************
*	全体Wrapper
* ***************************************************************** */

#wrapper .wrapper {
color: #f2f5f8;
margin: 0 auto; 
max-width: 1000px;
padding: 30px 0px 320px 0px;
}

.wrapper #main {
max-width: 1000px;
padding: 0 0 0 0;
}

/* wrapper（SG側設定）
---------------------------------------------------- */

#wrapper {
padding-top: 80px;
}

/* リンク
---------------------------------------------------- */

#main .row a{
color:#f2f5f8;
}

#main .row a:hover{
color:#f2f5f8;
text-decoration: underline;
}

a{
color:#f2f5f8;
text-decoration:none;
  transition: All 0.15s ease;
  -webkit-transition: All 0.15s ease;
  -moz-transition: All 0.15s ease;
  -o-transition: All 0.15s ease;
}

a:hover{
color:#f2f5f8;
text-decoration: underline;
}

/* リスト
---------------------------------------------------- */

li a {
color:#f2f5f8;
transition: 0.5s;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-ms-transition: 0.5s;
}

li a:hover{
color:#f2f5f8;
text-decoration: underline;
}

#service_menu li a {
color:#f2f5f8;
transition: 0.5s;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-ms-transition: 0.5s;
}

.gnav li ul {
width: 100%;
line-height: 1.8;
padding: 0px; 
margin: 0px; }

.gnav a {
color:#f2f5f8; }

.gnav a:hover {
color:#f2f5f8;
}
	
.c-flex ul {
width: 100%;
padding: 0px; 
margin: 0px; 
}

#nav {
max-width: 1000px;
margin: 0 auto 0px auto;
z-index: 9999;
padding: 0;
text-align: center;
}

/* ***************************************************************** 
*	ヘッダー（SG側設定）
* ***************************************************************** */

#header {
width: 100%;
margin: 0 auto; 
display: block;
top:0px;
}

.header-inner {
max-width: 1000px;
overflow: hidden;
margin: 0px auto;
padding: 0px;
}

#service_menu .nav_toggle p {
	color: #f2f5f8;
	font-size: 1.4rem;
}

/* *****************************************************************
*	フッター（SG側設定）
* ***************************************************************** */	

#wrapper footer {
  position: absolute;
  width: 100%;
  bottom: 0;
}


footer p {
color: #f2f5f8;
font-size: 1.4rem;
line-height: 1.8;
}

footer p a{
color: #f2f5f8;
}

@media only screen and (max-width: 767px) {
footer .logo img { max-height: 100%; }
}

/* *****************************************************************
*	ページ内部
* ***************************************************************** */	

/* ブログ記事部分
---------------------------------------------------- */

#main .row p {
font-size: 16px; 
color: #f2f5f8;
line-height: 200%;
padding: 10px 0px 10px 0px;
}

p a {
color:#f2f5f8;
text-decoration: none;
transition: 0.5s;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-ms-transition: 0.5s;
}

p a:hover {
color:#f2f5f8;
text-decoration: underline;
}


/* ギャラリーレイアウト
---------------------------------------------------- */

#main .row li.item {
height: 340px;
padding: 15px;
margin-bottom: 5px;
background-color: #1F2325;
}

#main .row li.item h2{
text-decoration: none;
}

#main .row .item-cat-name {
background: #161616;
font-size: 1.3rem;
}

#main .row .item-date {
	font-size: 1.3rem;
}

#wrapper .news {
background-color: #161616;	
}

#wrapper #pageTitle .pageTitle_jp .news {
  width: 82%;
padding-left: 15px;
}

#wrapper #pageTitle .pageTitle_jp .gallery {
  width: 78%;
padding-left: 15px;
}



/* 次の記事・前の記事
---------------------------------------------------- */


#main .row .next-left a {
border-radius: 5px;
padding: 20px 20px 20px 50px;
display: block;
border: 1px solid #f2f5f8;
}

#main .row .next-left a:hover {
background: #f2f5f8;
color: #161616;	
text-decoration: none;
}

#main .row .next-right a {
border-radius: 5px;
padding: 20px 50px 20px 20px;
display: block;
border: 1px solid #f2f5f8;
}

#main .row .next-right a:hover {
background: #f2f5f8;
color: #161616;	
text-decoration: none;
}

/* ページャー
---------------------------------------------------- */

#main .row .pager {
text-align:center;
margin: 30px 0 30px 0;
}

#main .row a.page-numbers,
.pager .current {
background: #161616;
padding: 10px 10px;
margin:0 2px;
}

#main .row .pager .current {
background: #1F2325;
color: #f2f5f8;
}

/*=========================================
･ Works（SG設定側）
=========================================*/

#wrapper #content {
   margin-bottom: 0px;
}

#main .row .blog-title {
	color: #f2f5f8;
    padding: 18px 15px 15px 15px;}

#main .row .pagetitle-single{
color: #999;
padding-left: 15px;
}

#main .row .similar-head {
margin: 50px 0px 10px 0px;
color:#f2f5f8;	
padding: 0 15px 3px 15px;
}

#main .row .single-contents{
background-color: #1F2325;
padding: 15px;
margin: 0 0 15px 0;
}

#main .row h4 {
color: #f2f5f8;
}

#main .row .blog-foot{
padding: 0 15px;
}

#pageTitle p {
color:#f2f5f8; 
}

#works .sec00 .pickup li p {
color:#f2f5f8;
}

#works .sec00 .pickup li p:hover {
color:#d82e2d;
}

/* ************************************************ 
*	Blocks
* ************************************************ */

.block-three {
list-style: none;
margin-left: -0.5%;
margin-bottom: 0;
}

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

.block-three > li {
height: auto;
float: left;
margin-bottom: 1.5em;
margin-left: 0.5%;
}

.block-three> li {
width: 32.7777%;
}

@media only screen and (max-width: 767px) {

/* Blocks */
#main .row .block-three {
margin-left: 0%;
margin-bottom: 1.5em;
}

.block-three > li {
float: none;
width: 100%;
}
	
#main .row .block-two {
margin-left: 0%;
margin-bottom: 1.5em;
}

.block-two > li {
margin-left: 0px;
}
}


/* *****************************************************************
*   レスポンシブ（メディアクエリ）
* ***************************************************************** */


/* PC 画面の横幅が1000px以上
---------------------------------------------------- */

@media only screen and (min-width: 1000px) {
.sidebar { width: 300px; }
.pc-ad-none { display: none; }
.item-img { height: 200px; margin: 0 0 10px 0; overflow: hidden; }
}

/* Tablet (Portrait) 画面の横幅が959px〜999PXまで（SGに合わせたもの）
---------------------------------------------------- */

@media only screen and (min-width: 959px) and (max-width: 999px) {
#wrapper .wrapper { width: 100%; padding: 30px 0px 320px 0px; }
#nav { float: none; width: 100%; margin: 0 auto 0px auto; padding: 0; }
#main .row li.item { height: 340px; margin-bottom:5px; }
li.item-gallery { height: 200px; }
.item-img { height: 200px; margin: 0 0 10px 0; overflow: hidden; }
.twothird { width: 340px; margin-right:10px; }
#wrapper #works .btn.contact a { width: 100%; }
#wrapper #works .container { width: 100%; }
}


/* Tablet (Portrait) 画面の横幅が768px〜959pxまで（WPの修正）
---------------------------------------------------- */

@media only screen and (min-width: 768px) and (max-width: 959px) {
#wrapper .wrapper { width: 100%; padding: 30px 0px 320px 0px; }
#nav { float: none; width: 100%; margin: 0 auto 0px auto; padding: 0; }
#main .row li.item { height: 310px; margin-bottom:5px;}
li.item-gallery { height: 200px; }
.item-img { height: 200px; margin: 0 0 10px 0; overflow: hidden; }
.twothird { width: 310px; margin-right:10px; }
#wrapper #works .btn.contact a { width: 100%; }
#wrapper #works .container { width: 100%; }
}

/* Tablet (Portrait) 画面の横幅が737px〜767pxまで（SGに合わせたもの）
---------------------------------------------------- */

@media only screen and (min-width: 737px) and (max-width: 767px) {
#wrapper .wrapper { width: 100%; padding-bottom: 500px; }
#nav { float: none; width: 100%; margin: 0 auto 10px auto; padding: 0; }
#main .row li.item { height: 400px; margin-left: 0px; margin-bottom:5px; }
li.item-gallery { height: 200px; }
.item-img { height: 200px; margin: 0 0 10px 0; overflow: hidden; }
.twothird { width: 400px; margin-right:10px; }
#main .row #next{ margin: 50px 15px 20px 15px; }
#wrapper #works .btn.contact a { width: 100%; }
#wrapper #works .container { width: 95%; }
}

/* Mobile (Portrait) 画面の横幅が300px~736pxまで（基本）
---------------------------------------------------- */

@media only screen and (max-width: 736px) {
#wrapper .wrapper { width: 100%; padding-bottom: 520px;}
#spnav .toggle { display: block; float: none; position: relative; padding: 10px 8.95vw; top: 0; right: 0; z-index: 10000; }
#main .row li.item { height: 400px; margin-left: 0px; margin-bottom: 5px; }
#wrapper { padding-top: 0px; }
#main .row #next { margin: 50px 15px 20px 15px; }
#wrapper #works .btn.contact a { width: 100%; }
#wrapper #works .container { width: 95%; }
#main .single-contents br { display: block; }
#main .top-wide-contents br { display: block; }
}


/* Mobile (Portrait/iPhone6) 画面の横幅が375px〜479pxまで（SGに合わせたもの）
---------------------------------------------------- */

@media only screen and (min-width: 375px) and (max-width: 479px) {
#wrapper .wrapper { width: 100%; padding-bottom: 520px;}
#main .row li.item { height: 350px; margin-bottom: 5px; }
#main .row #next{ margin: 50px 15px 20px 15px; }
#wrapper #works .btn.contact a { width: 100%; }
#wrapper #works .container { width: 95%; }
}


/* Mobile (Landscape) 画面の横幅が480px〜767pxまで（WPの修正）
---------------------------------------------------- */

@media only screen and (min-width: 480px) and (max-width: 767px) {
#main .row li.item { height: 400px; margin-bottom: 5px; }
#main .row #next{ margin: 50px 15px 20px 15px; }
#wrapper #works .btn.contact a { width: 100%; }
#wrapper #works .container { width: 95%; }
}