@charset "utf-8";
/* CSS Document */
/*
Theme Name: ORIGINAL
Description: オリジナルテーマ
Version: 1.1
Author: RYUJI KIRA
*/

@import url('https://fonts.googleapis.com/css?family=Lato:400,700|Noto+Sans+JP:400,700');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@800&display=swap');

/* CLEAR FIX */
.cf:after{content: "."; display: block; height: 0;  clear: both; visibility:hidden;}
.cf{display: inline-table;} 
/* Hides from IE Mac */
* html .cf{height: 1%;}
.cf{display:block;}

/* BOXSIZING */
.boxSizing { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}

/* =======PRUGIN SETTINGS======= */
/* PAGE TOP */
.pagetop {position: fixed;bottom: 55px;right: 55px;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0.3);-moz-transform: scale(0.3);-ms-transform: scale(0.3);-o-transform: scale(0.3);transform: scale(0.3);-webkit-transition: all .4s;-moz-transition: all .4s;	-o-transition: all .4s;	transition: all .4s;}
.pagetop a {display: block;width: 50px;	height: 50px;background-color: #000;text-align: center;color: #fff;font-size: 1em;text-decoration: none;line-height: 50px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%;}
.pagetop.show {	opacity: 1;filter: alpha(opacity=100);-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);}

/* BLOCK LINK */
.box-link{cursor:pointer;}
.box-link,
.box-link::before,
.box-link::after {-webkit-transition: all .3s;transition: all .3s;}
.box-link:hover{background:#f9f9f9;}


/* =======WP PAGENAVI SETTINGS======= */
.wp-pagenavi {clear: both; text-align: center; margin-bottom: 100px; margin-top: -50px;}
.wp-pagenavi a, .wp-pagenavi span {display:inline-block;color:#444; background-color:#EEE; padding: 8px 15px; margin:0 1px; white-space: nowrap; -moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out;-o-transition: 0.2s ease-in-out;transition: 0.2s ease-in-out;}
.wp-pagenavi a:hover, .wp-pagenavi span.current {color:#FFF;background-color:#666;border-color:#666;}
.wp-pagenavi span.current {color:#FFF;background-color:#333;border-color:#333;font-weight: bold;}

/* =======WP CONTACT FORM7 SETTINGS======= */
.wpcf7 input,select,textarea{  border: none; padding:10px; margin:10px 0; background:#EEE;}
.wpcf7 p{margin-bottom:30px; }
.wpcf7-not-valid-tip{color:#ed58a0 !important; font-size:0.9em !important; }
.wpcf7-submit{text-align:center; color:#FFF;  width: 100%;  cursor: pointer;}
.wpcf7-validation-errors{border: 2px solid #EEE !important; font-size:0.9em !important; color:#666 !important;padding:10px !important;}
input.wpcf7-form-control.wpcf7-submit {padding: 20px; margin: 30px 0 0 0; background: #79BD9A;}
span.wpcf7-quiz-label {margin-right: 30px;}

/* =======TABLE PRESS======= */
.tablepress{width: 100%; margin-bottom: 50px;}
.tablepress td {border: 1px solid #CCC; padding: 10px;}
/* .table-col1 */
td.column-1 {white-space: nowrap; width:20%;}
.basic-table {font-size: 0.8em; width: 100%;}
.basic-table td{border: 1px solid #CCC; padding: 15px;}
.basic-table th {border: 1px solid #CCC; padding: 15px; white-space: nowrap; font-weight: bold;}

.basic-table2 {font-size: 0.8em; width:100%; margin-bottom: 30px;}
.basic-table2 td{border: 1px solid #CCC; padding: 15px;}
.basic-table2 th {border: 1px solid #CCC; padding: 15px; width: 10%; white-space: nowrap; font-weight: bold;}

.basic-table3 {font-size: 0.8em; width:100%; margin-bottom: 30px;}
.basic-table3 td{width:50%; border: 1px solid #CCC; padding: 15px;}

/* =======SLIDER======= */
.slick-slide {box-sizing: border-box; cursor: pointer;}
.slick-slider div { transition: none; }

/* ======= BASIC ======= */
html,body { height: 100%; width: 100%; min-width: 1000px; }
body{font-family: Lato, 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #222; letter-spacing: 0.1em;}

img {max-width: 100%; height: auto;}
a{color:#222; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
a:hover{color:#CCC;}
/* ======= 2021/12/19追記イメージ配置 ======= */
img.alignright{display: block;margin: 0 0 0 auto;}
img.alignleft{display: block;margin: 0 auto 0 0;}
img.aligncenter{display: block; margin: 0 auto;}
/* OTHER-STYLING */
.big{font-size:1.4em;}
.small{font-size:0.6em;}
.bg-brack{display:inline-block; background:#000; padding:10px 15px; font-size:0.8em; color:#FFF; margin-right:10px; vertical-align: super; margin:10px 0;}
.bgglay {background: #EEE; padding: 30px;}
.arrow-down{ margin-bottom: 30px; font-size: 3em;}
.mb0{margin-bottom:0 !important;}
.mb10{margin-bottom:10px;}
.mb30{margin-bottom:30px;}
.mb50{margin-bottom:50px;}
.sp{display:none !important;}
.menu-sp{display:none !important;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.text-center{text-align:center;}

section.w1080{width:980px; margin:0 auto;}
.page p {text-align: justify; line-height: 2.0em; letter-spacing: 0.1em; }
.jump{margin-top:-152px; padding-top:152px;}
.jump2 {margin-top: -90px; padding-top: 90px;}
.orenge {color: #FCAA00;}
.dots {background-color: #ffffff; background-image: radial-gradient(#ffc1c2 21%, transparent 29%),radial-gradient(#ffc1c2 21%, transparent 29%);
  background-position: 0 0, 3px 3px; background-size: 6px 6px;}
.name {font-weight: bold; display: block; text-align: right;}

/* ======= HEADER ======= */
header{ background:#FFF; width:100%; z-index: 9999; position: fixed; top: 0;}
.header-inr {position: relative;}
.header-inr h1 {float: left; padding: 10px 0 0 35px;}
#header-box h1 img{ width:200px; height:auto; padding-top: 10px;}
.headBox {float: right;}
/* global nav */
#gnav {}
.nav-button-box {display: inline-block;padding: 20px; z-index: 50; vertical-align: top; background: #fff;}
.nav-button-box p {font-size: 0.5em;text-align: center; margin-top: 5px;}
.nav-button {display: block; cursor: pointer; }
.nav-wrap {position: fixed;left: 0;top: 0;  display:none; width: 100%; height: 100%; text-align: center; padding: 100px; box-sizing: border-box; background: rgba(197,221,249,0.9);
    font-size: 1.2em;}
.nav-wrap a{text-decoration:none; padding: 8px 0; display: inline-block; color:#222; font-size: 0.9em; font-weight: bold;}
.nav-wrap a:hover{font-size:1.2em; color:#FFF; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease; }

ul.headbtn {float: left;margin-right: 20px;}
ul.headbtn li {display: inline-block; padding: 25px 10px;}
ul.headbtn li a {text-decoration: none;}

/*メニューボタンのエフェクト*/
.nav-button span { display: inline-block; transition: all 0.4s; box-sizing: border-box;}
.nav-button { z-index: 20; position: relative; width: 40px; height: 36px;}
.nav-button span {position: absolute; left: 0; width: 100%; height: 4px; background-color: #222; border-radius: 4px;}
.nav-button span:nth-of-type(1) {top: 0;}
.nav-button span:nth-of-type(2) {top: 16px;}
.nav-button span:nth-of-type(3) {bottom: 0;}

.nav-button.active span:nth-of-type(1) {
-webkit-transform: translateY(16px) rotate(-45deg);
transform: translateY(16px) rotate(-45deg);
}
.nav-button.active span:nth-of-type(2) {
opacity: 0;
}
.nav-button.active span:nth-of-type(3) {
-webkit-transform: translateY(-16px) rotate(45deg);
transform: translateY(-16px) rotate(45deg);
}

/*飾りボタンのエフェクト*/
.border{position:absolute; background:none; transition:all .5s ease-in-out;}
.border:nth-of-type(1){top:0; left:0; width:0; height:0;  border-top:1px solid #000;}
.border:nth-of-type(2){top:0; right:0; width:0; height:0; border-right:1px solid #000;}
.border:nth-of-type(3){bottom:0;right:0; width:0; height:0; border-bottom:1px solid #000;}
.border:nth-of-type(4){bottom:0;left:0; width:0; height:0; border-left:1px solid #000;}
a:hover .border:nth-of-type(1){width:100%;}
a:hover .border:nth-of-type(2){height:100%;}
a:hover .border:nth-of-type(3){width:100%;}
a:hover .border:nth-of-type(4){height:100%;}

/* ======= FOOTER ======= */
footer{width:100%; border-top: 1px solid #222; text-align: center; padding: 30px 0 0; margin-top: 100px;}
footer a{text-decoration:none; color:#222;}
footer img {width: 350px; height: auto; margin: 0 0 30px 0;}
footer p {margin-bottom: 30px;}
ul.sns li {display: inline-block; font-size: 1.5em;  margin-bottom: 50px;}

ul.footNav {letter-spacing: -.4em; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC;}
ul.footNav li {position:relative; width: 50%;display: inline-block; letter-spacing: 0.1em; box-sizing: border-box;}
ul.footNav li:first-child{border-right: 1px solid #CCC;}
ul.footNav li a{ padding: 30px; display: block; background: #EFEFEF;}
ul.footNav li a:hover{background: #ee8100; color:#FFF;}
ul.footNav li i{position:absolute; right: 22px; top: 22px; font-size: 2em;}

ul.footMenu {padding: 30px; background: #88a3d4;}
ul.footMenu li {display: inline-block; margin: 0 10px;}

p.copyRight {padding: 30px; background: #1f2774; color: #FFF;}
/*  ======= TOP =======  */
#container {padding-top: 76px;}
.toppage h2{font-family: 'Poppins', sans-serif;}
.toppage h3{font-family: 'Poppins', sans-serif; font-size:3vw;}


/* TEASER */
#teaser{width: 100%; position: relative;}
.slider-1 {width: 50%; height: auto; float: left;}
.slider-2 {width: 50%; float: right;}
.teaserTitle { position: absolute; margin: auto; top: 0; right: 0; left: 0; bottom: 0; width: 80%; height: 20%; -webkit- transform: translateY(-50%) translateX(-50%);
    text-align: center; color: #FFF;}
.teaserTitle h2 {font-size: 3.5vw; text-shadow: 1px 2px 3px #4C4C4C;}
.teaserTitle p {font-size: 1.2vw; letter-spacing: 0.3em; margin-top: 10px; text-shadow: 1px 2px 3px #4C4C4C;}

/* STAGE01 */
#stage01 {box-sizing: border-box; background: #c5ddf9; padding: 120px 0; background-size: cover; text-align: center;}
#stage01 h4 {font-size: 1.2em; font-weight: bold; margin: 30px 0;}
#stage01 .readmore {position: absolute; margin: 0 auto;  bottom: -15px; left: 0; right: 0;}
#stage01 a {display: inline-block; background: #FFF; padding: 20px 150px; text-decoration: none; margin-top: 50px;position: relative;}
#stage01 a:hover{color:#222;}
.stage02Post ul li {border-bottom: 1px solid #CCC; padding: 10px;}
#stage01 p {line-height: 1.8em; letter-spacing: 0.2em;}

/* STAGE02 */
.stage0203Cover {background: url(img/bbg1.jpg)no-repeat; background-size: contain; padding: 150px 0;}

#stage02 {position: relative; width: 980px; margin: 0 auto 150px;}
#stage02 h3{text-align: center; margin-bottom: 50px;}
#stage02 a{text-decoration:none;}
.st02allview {position: absolute; right: 0; top: 20px; color:#ee8100;}
.stage02Post {width: 980px; margin: 0 auto;}
.stage02Post ul li {border-bottom: 1px solid #CCC; padding: 10px;}
.stage02Post ul li span{margin-right:20px;}

/* STAGE03 */
#stage03{width: 980px; margin: 0 auto; position: relative;}
#stage03 h3{text-align: center; margin-bottom: 50px;}
#stage03 a{text-decoration:none;}
.st03allview {position: absolute; right: 0; top: 20px; color:#ee8100;}
#stage03 ul { text-align: center;}
#stage03 ul li {font-weight: bold;}
#stage03 ul li  { font-weight: bold; margin-bottom: 50px; }
#stage03 ul li img {margin-bottom: 30px;}

/* STAGE04 */
#stage04 {text-align: center; position: relative; }
.centerBox {position: absolute; margin: auto; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 50%;}
.centerBox h3 {color: #FFF;}
.centerBox h3 span {display: block; font-size: 0.4em; font-family: Lato, 'Noto Sans JP', sans-serif; text-shadow: 1px 2px 3px #808080;}
#stage04 a {display: inline-block; background: #FFF; padding: 1vw 8vw; text-decoration: none; margin-top: 50px;position: relative; font-size: 0.8vw;}
#stage04 a:hover{color:#222;}

/* STAGE05 */
#stage05 {text-align: center; position: relative; }
#stage05 a {display: inline-block; background: #FFF; padding: 1vw 8vw; text-decoration: none; margin-top: 50px;position: relative; font-size: 0.8vw;}
#stage05 a:hover{color:#222;}

/* STAGE06 */
.stage06Cover{background: url(img/bbg2.jpg)no-repeat; background-size: cover;}
#stage06 {padding: 100px 0; width: 80%; margin: 0 auto;}
#stage06 h3 {  position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 90%; height: 25%; color: #FFF;}
#stage06 h3 span {font-size: 0.3em; display: block; font-family: Lato, 'Noto Sans JP', sans-serif;}
#stage06 ul li {text-align: center; position: relative;}
#stage06 ul li:nth-child(2) {margin-top: 200px;}

/* STAGE07 */
#stage07 {text-align: center; position: relative; }
#stage07 a {display: inline-block; background: #FFF; padding: 1vw 8vw; text-decoration: none; margin-top: 50px;position: relative; font-size: 0.8vw;}
#stage07 a:hover{color:#222;}

/* ======= PAGES ======= */
#contents-page{width:980px; margin:0 auto;}

.page-title {padding:170px 0 80px; text-align: center; width: 100%; background: url("img/titlebg.jpg")no-repeat center; background-size: cover; position: relative;}
.page-title h2 {font-family: 'Poppins', sans-serif; text-align: center; font-size: 3em; font-weight: bold; color: #FFF;}

.page h3 {font-size: 1.5em; font-weight: bold; margin-bottom: 50px;}
.page h3 span {display: inline-block; width: 100px; height: 100px; vertical-align: middle; margin-right: -50px;}

.titleBox{text-align:center; margin-bottom: 76px;}
.titleBox p{text-align:center;}

.basebox {margin-bottom: 100px;}
.basebox.pickup h3 {text-align: center;text-align: center;font-size: 1.8em;letter-spacing: 0.4em;margin-bottom: 30px;}
.basebox.pickup p {text-align: center; text-align: center; line-height: 2.5em; margin-bottom: 50px;}
.basebox h4 {text-align: left; margin-bottom: 30px; font-weight: bold; font-size: 1.2em; border-left: 5px solid #1f2774; padding: 10px 20px;}
.basebox h5 {font-weight: bold; margin-bottom: 30px;}
table.base th {white-space: nowrap; padding: 10px 20px; border: 1px solid #CCC;}
table.base {font-size: 0.9em; width: 100%; line-height: 2.0em;}
table.base td {border: 1px solid #CCC; padding: 10px 20px;}
table.no-line {width: 100%;}

ul.col2{letter-spacing: -.4em; width:100%;}
ul.col2 li{letter-spacing: 0.1em; display:inline-block; width:47%; vertical-align: top;}
ul.col2 li:nth-child(odd){margin-right:6%;}
ul.col-img li{text-align:center;}
ul.col-img li img{margin-bottom:10px;}
ul.col3{letter-spacing: -.4em; width:100%;}
ul.col3 li{letter-spacing: 0.1em; display:inline-block; width:32%; vertical-align: top;}
ul.col3 li:nth-child(3n-1){margin:0 2%;}
ul.col4{letter-spacing: -.4em; width:100%;}
ul.col4 li{letter-spacing: 0.1em; display:inline-block; width:23.33333%; vertical-align: top; margin:0 0 0 2%;}
ul.col4 li:nth-child(4n+1){margin:0 0 0 0;}

.allbox-right{float: right; width:50%;}
.allbox-left{float: left; width:50%; }
.pad-box{padding:0 80px; box-sizing:border-box;}

/**** CONTACT ****/
.tableCon td {border-bottom: 1px solid #CCC; padding: 20px 0;}
.tableCon th {border-bottom: 1px solid #CCC; padding: 20px 0;}
.tableCon th span {color: #FCAA00;}
.scrollBox {height: 300px; border: 1px solid #CCC; overflow: auto; padding: 50px; box-sizing: border-box; margin-bottom: 30px; font-size: small; line-height: 0;}

/* FAQ */
.question {position: relative;  background: #c5ddf9;  padding:20px 30px; margin-bottom:20px; font-weight: bold;}
.question:after, .question:before {top: 100%; left: 10%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none;}
.question:after {border-color: rgba(255, 255, 255, 0); border-top-color: #c5ddf9; border-width: 10px; margin-left: -10px;}
.question:before {border-color: rgba(51, 51, 51, 0); border-top-color: #c5ddf9; border-width: 16px; margin-left: -16px;}

/* DIRECTOR */
p.keireki {background: #EEE; font-size: 0.8em; line-height: normal; padding: 15px 20px 20px 20px; box-sizing: border-box;}
p.keireki span {display: block; font-weight: bold; padding: 5px 0; color: #346e36;}
.directorBox {margin-bottom: 50px;}
.directorBox h3 {font-size: 6em; margin-bottom: -38px;}
.diretorBoxInr {background: #EEE; padding: 50px; box-sizing: border-box;}
.diretorBoxInr h5 {font-size: 1.4em; font-weight: bold; margin-bottom: 20px;}
ul.col3.directorCol p {margin-top: 10px; line-height: normal; font-size: 0.9em;}

/* INTERVIEW */
.interviewBox {margin-bottom: 50px;}
.interviewBox h3 {font-size: 6em; margin-bottom: -38px;}
.interviewBoxInr {background: #EEE; padding: 50px; box-sizing: border-box;}
.interviewBoxInr h5 {font-size: 1.4em; font-weight: bold;}
ul.col3.interviewCol p {margin-top: 10px; line-height: normal; font-size: 0.9em;}
.basebox.interviewBox p {margin-bottom: 30px;}

/* WORK */

/* ======= CATEGORY ======= */
.cat-postbox li{border-bottom: 1px solid #EEE; padding: 20px;}
.cat-postbox li h3 a {text-decoration: none;}
.cat-postbox li h3 span {margin-right: 30px;}

.tag-title {text-align: center; border-bottom: 1px solid #CCC; padding-bottom: 30px;}
.tag-title h3 {font-size: 1.5em; font-weight: bold; margin-bottom: 20px;}

.cat-back { margin-bottom: 50px;}
.cat-nav {text-align:center;}
.cat-nav li{margin:10px 5px; display: inline-block;}
.cat-nav li a {background: #CCC; text-decoration: none; display: inline-block; padding: 9px 15px; border-radius: 50px;}
.cat-nav li a:hover {background: #fec1c2; color:#222;}


/* RECRUIT */
.cat-icatch ul{margin-top:50px;}
.cat-icatch ul li {text-align: center ;margin-bottom:50px;}
.cat-icatch ul li img {margin-bottom: 20px;}
.cat-icatch a {text-decoration: none;}
.single-teaser ul {background: #1f2774;letter-spacing: -.4em;}
.single-teaser ul li {display: inline-block; vertical-align: middle; width: 50%;letter-spacing: 0.1em; text-align: center; font-size: 3em;font-weight: bold;}
.single-teaser ul li img {width: 100%; height: auto; min-width: 100%;}
a.single-contact {text-align: center; display: block; background: #ee8100; text-decoration: none; color: #FFF; padding: 20px; border-radius: 50px;}

/* WORKSTYLE */
.workBox {background: linear-gradient(to bottom, #c5ddf9 0%, #1f2774 50%, #FFF 50%, #FFF 100%); text-align: center; padding: 100px 0 0;}
.workBox img {width: 60%; height: auto;}
.workBox p {background: #1f2774; position: absolute; padding: 30px 158px; font-size: 1.5em; left: 16vw; bottom: 9%;}

/* ======= SINGLE PAGE ======= */
.single-teaser {position: relative; margin-bottom: 50px; color: #FFF;}
.single-postbox .single-teaser h3 {text-align: left; font-size: 2em; background: #ffc1c2; display: inline-block; padding: 20px 50px; line-height: normal;
    margin-top: -50px; margin-left: -50px;}
h3.editor-title {border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; padding: 20px 0; margin-bottom: 20px; font-size: 1.2em; font-weight: bold;}
.single-postbox {margin-bottom: 50px;}

a.single-back {background: #ffc1c2; display: block; width: 90%; text-align: center;  margin: 0 auto 100px; padding: 20px 0; border-radius: 10px; text-decoration: none;}
a.single-back:hover{ background: #CCC; color:#222;}

.cat_paging {width: 100%; position: relative;}
.cat_paging a{border: 1px solid #666; border-radius: 10px; padding: 20px; text-align: center; width: 30%; box-sizing: border-box; text-decoration:none;}
.cat_paging a:hover{background:#EEE;}
.alignRight a {left: 0; top: 0; position: absolute; }
.alignLeft a{right: 0; top: 0; position: absolute;}
.alignCenter a{display: block; margin: 0 auto;}

/* 投稿エリアの設定 */
#editor-area a{color:#444;}
#editor-area a:hover{background:#EEEEEE;}
#editor-area img{max-width: 100%; height:auto; display:block;}
#editor-area h4{font-size: 1.5em !important;line-height: 1.5em; margin-bottom: 25px !important; font-weight: bold;border-left: 4px solid #1f2774; padding: 0.7em 0 0.7em 1em; }
#editor-area h5{font-size: 1.2em; padding-bottom:10px; margin-bottom:30px; color:#1f2774; font-weight: bold; border-bottom: 1px solid #CCC;}
#editor-area p{margin-bottom:30px; line-height: 1.8em;}
#editor-area ul{margin: 30px 0 30px 5px;}
#editor-area ul li{margin: 2px 0 2px 15px;  list-style: disc;}
#editor-area table{ width: 100%; border-collapse: collapse; margin-bottom:30px;}
#editor-area table th{padding: 10px; background-color: #eee; border: 1px solid #CCC;}
#editor-area table td { padding: 10px; border: 1px solid #EEE;}
#editor-area blockquote{padding: 20px; margin-bottom:30px; background:#EEEEEE;}
#editor-area blockquote p{margin:0px !important;}
#editor-area div.borderbox{border:1px dotted #CCC; padding: 20px; margin-bottom:30px;}
#editor-area div.borderbox p{margin:0px !important;}
#editor-area div.borderbox ul{margin:0px !important;}

#editor-area iframe::before { content: "<div>";}
#editor-area iframe::after { content: "</div>";}


@media screen and (max-width: 1279px) {
 /*　================================ for ipad ================================　*/

}
@media screen and (max-width: 480px) {
 /*　================================ for iphone ================================　*/

/* HEAD */
html,body { height: 100%; width: 100%; min-width: 100%; font-size: 14px;}
section.w1080 {width:80%; margin: 0 auto;}
.pagetop{bottom:10px; right:10px;}
.sp{display:block !important;}
.pc{display:none !important;}
.mb50 {margin-bottom: 20px;}

.button {padding: .9em 30%;}

/* header */
#header-box h1 img {width: 180px; -webkit-backface-visibility: hidden; padding-top: 15px;}
.header-inr h1 {padding: 10px 0 0 17px;}
.nav-wrap {padding: 80px 10px; font-size: 1em;}
.nav-wrap a { padding: 10px 0; }

/* footer */
footer {margin-top: 30px; padding: 30px 0 0;}
footer a{text-decoration:none;}
footer img {width: 65%; height: auto;}
footer p { margin-bottom: 30px;  padding: 0px 30px;}
ul.footNav li i {position: absolute; right: 8px; top: 32px; font-size: 1em;}
ul.footMenu li {display: block;  margin: 0;}
ul.footMenu li a { display: block; padding: 10px 0;}
p.copyRight {font-size: 0.5em;}

/* 共通 */
#container{width:100%; margin:0; padding:0;}
.page{font-size:0.9em;}
.stage-bg{display:block; width:100%; height:auto;}
.title{text-align:center; padding: 50px 0; color: #FFF;}
.title h2{font-size: 1.5em;}
.title ul li{margin-bottom:10px;}
.title ul li a{text-decoration:none; color:#FFF;}
.title ul li a:hover{opacity:0.5;}

ul.col2.top li a {text-align: center;}

table.base th {white-space: nowrap; padding: 10px; border: none; display: block; border-bottom: 1px solid #CCC; background: #F5F5F5;}
table.base td {border: none; border-bottom: 1px solid #CCC; padding: 10px 0; display: block; box-sizing: border-box;}

.basebox {margin-bottom: 30px;}
.basebox h4 {margin-bottom: 20px;}
.basebox h5 {margin-bottom: 20px;}
.basebox.pickup h3 {text-align: center; font-size: 1.5em; letter-spacing: 0.1em;  margin-bottom: 30px;}
.basebox.pickup p {text-align: justify; line-height: 2em;}

.bread_crumb {font-size: 0.6em; padding: 5px 5px; letter-spacing: normal;}

/* TEASER */
#teaser {margin-top: 60px;}
.slider-1 {width: 100%; height: auto; float: none;}
.slider-2 {width: 100%; float: none;}
.teaserTitle {height: 10%;}
.teaserTitle h2 {font-size: 6vw; text-shadow: 1px 2px 3px #4C4C4C;}
.teaserTitle p {font-size: 3vw; letter-spacing: 0.1em; margin-top: 35px;}

/* STAGE01 */
#stage01 {padding: 10%; text-align: left;}
#stage01 a {display: block; padding: 20px; box-sizing: border-box; text-align: center; text-shadow: 1px 2px 3px #4C4C4C;}
.toppage h3 {font-size: 8vw;}
#stage01 h4 {font-size: 1em;}

/* STAGE02 */
.stage0203Cover {padding: 10%; background-size: cover;}
#stage02 {width: 100%; margin: 0 auto 30px;}
.stage02Post{width: 100%;}
#stage02 h3 {text-align: left; margin-bottom: 50px; margin-bottom: 10px;}
.st02allview {top: 10px;}
.stage02Post ul li span {display: block; margin-bottom: 10px;}

/* STAGE03 */
#stage03 {width: 100%;}
#stage03 h3 {text-align: left; margin-bottom: 10px;}
.st03allview {top: 10px;}
#stage03 ul li a:first-child {margin-right: 10%;}
#stage03 ul li a {display: inline-block; width: 44%; vertical-align: middle; text-align: left;}
#stage03 ul li {font-weight: bold;  margin-bottom: 10px;}
#stage03 ul li img { margin-bottom: 0;}

/* STAGE04 */
#stage04 a {display: block; padding: 15px; width: 90%; margin: 20px auto 0; box-sizing: border-box;}
#stage04 a {
display: block;
padding: 15px;
width: 90%;
margin: 20px auto 0;
box-sizing: border-box;
font-size:12px;
}
/* STAGE05 */
#stage05 a {display: block; padding: 15px; width: 90%; margin: 20px auto 0; box-sizing: border-box;}
#stage05 a {
display: block;
padding: 15px;
width: 90%;
margin: 20px auto 0;
box-sizing: border-box;
font-size:12px;
}
/* STAGE06 */
.stage06Cover {padding-bottom: 20px;}
#stage06 {padding: 20px 0 0; width: 90%; margin: 0 auto;}
#stage06 ul li:nth-child(2) {margin-top: 0;}

/* STAGE07 */
#stage07 a {display: block; padding: 15px; width: 90%; margin: 20px auto 0; box-sizing: border-box;}
#stage07 a {
display: block;
padding: 15px;
width: 90%;
margin: 20px auto 0;
box-sizing: border-box;
font-size:12px;
}
#contents-page {width: 100%; margin: 0 auto;}
.page-title {padding: 110px 0 30px; margin-bottom: 30px;}
.page-title h2 {font-size: 8vw;}

.page h3 {font-size: 1.1em; margin-bottom: 30px;}
.page h3 span {width: 50px; height: 50px; margin-right: -25px;}
.titleBox {margin-bottom: 30px;}

ul.col2 li{width: 100%; margin-bottom: 20px;}
ul.col2 li:nth-child(odd){margin-right: 0; margin-bottom: 20px;}
ul.col2 li:last-child{margin-bottom:0;}
ul.col3 li{width: 100%; margin-bottom: 20px;}
ul.col3 li:nth-child(3n-1){margin:0 0 20px 0;}
ul.col4 li{width:100%; margin:0 0 20px;}
ul.col4 li:nth-child(4n+1){margin:0 0 20px 0;}
ul.col3.blog li:nth-child(3n-1) {margin-bottom: 50px;}

/* ABOUT */
.about01 {height: 800px;}
.basebox.about02 ul {margin-top: -750px;}
.basebox.about02 ul li { padding: 30px;}

/* DIRECTOR */
.diretorBoxInr {padding: 30px;}
.directorBox h3 {font-size: 4em!important; margin-bottom: -14px!important;}
p.keireki {font-size: unset;}	

/* INTERVIEW */
.interviewBoxInr {padding: 30px;}
.interviewBox h3 {font-size: 3.5em!important; margin-bottom: -14px!important;}

/* WORK */
.question {padding: 20px 10px;}
.workBox {margin-top: -30px; padding: 30px 0 0;}
.workBox p {padding: 10px 30px; font-size: 1.1em; left: 5vw; bottom: 9%;}
.workBox img { width: 80%; height: auto;}

.tablepress {margin-bottom: 30px; font-size: 0.9em; border:1px solid #CCC}
.tablepress  td.column-1 {white-space: nowrap; width: 100%; background: #EEE; box-sizing: border-box;}
.tablepress td {border: none; padding: 15px; display: block;}
.tablepress th {border: none; padding: 15px; display: block;}

.basic-table {border:1px solid #CCC}
.basic-table th { background: #EEE; border: 0;}
.basic-table td {border: none; padding: 15px; display: block;}
.basic-table th {border: none; padding: 15px; display: block;}

.basic-table2 {border:1px solid #CCC}
.basic-table2 td{border: none; padding: 15px; display: block;}
.basic-table2 th{border: none; padding: 15px; display: block;}
.basic-table2 th {width: 100%; white-space: nowrap; background: #EEE; box-sizing: border-box;}

.tableCon th {display: block;}
.tableCon td {padding: 10px 0; display: block;}

/* =======POST AREA======= */
.cat-postbox h3 span {display: block; font-size: 0.8em; margin-bottom: 10px;}
.cat-postbox { padding: 10px 0;}
.cat-postbox li { padding: 20px 0; font-size: 0.9em;}
.cat-nav li {margin: 5px 5px; font-size: 0.8em;}

.single-postbox {padding: 0;  margin-bottom: 30px;}
.single-postbox h3 {padding: 20px 0; font-size: 1.2em;}
.single-postbox h3 span {display: block; font-size: 0.6em; margin-bottom: 10px;}

.cat_paging a {padding: 20px 5px; font-size: 0.9em;}

/* MESSAGE */
.single-teaser {margin-bottom: 30px;}
.single-teaser-box {padding: 20px; position: relative; bottom: 0; left: 0; font-size: 0.9em; text-align: center;}
.tag-title {margin-bottom: 50px; padding: 30px 0;}

.single-teaser ul {margin-top: -30px;}
.single-teaser ul li {font-size: 1em;}
.scrollBox {padding: 20px;}

/* =======EDITOR AREA======= */
#editor-area p {font-size: 0.9em;}
#editor-area h4 {font-size: 1em !important; margin-bottom: 25px !important; }
#editor-area h5 {font-size: 1em; margin-bottom: 10px;}
#editor-area table {border: 1px solid #EEE!important;}
#editor-area table td {border: none; display: block; width: 100%!important; box-sizing: border-box;}
#editor-area table td:nth-child(odd){background:#f5f5f5;}

/* =======WP CONTACT FORM7 SETTINGS　577-579追記8/25======= */
.wpcf7 select,textarea{padding:5%; width:100%; box-sizing: border-box;}
.table-entry table td {display: block; border: none;}
.table-entry table {border: 1px solid #CCC;}
.table-entry table th {border: none;}
input.wpcf7-form-control.wpcf7-text {padding:5%; width: 100%; box-sizing: border-box;}
input.w30 { width: 20%!important;}
span.wpcf7-quiz-label {margin-right:0;display:block;}
.wp-pagenavi {margin-top: 0;}
span.wpcf7-list-item {
width: 47.5%
}

}
/* =======23021/08/25追記======= */
@media screen and (min-width: 680px){   
  .pc { display:inline; }
  .sp { display:none; }
}
@media screen and (max-width: 680px){   
  .pc { display:none; }
  .sp { display:inline; }
}
/* =======23021/11/02追記======= */
#gallery-1 .gallery-item {
    float: left;
    margin-top: 10px;
	margin-bottom: 30px;
    text-align: left !important;
	width: 33%;}