@charset "UTF-8";
/*初期設定
----------------------------------------------------*/
html {
  font-size: 62.5%;
  height:100%;
	padding:0;
	margin:0;
  /*10px*/
}
body {
	min-width:320px;
	/*background-image: linear-gradient(-90deg, #f9f9f9, #ffffff);*/
	background-color:#fff;
	line-height: 1.5;
	font-size: 14px;
	font-size: 1.4rem;
	font-family: "Open Sans","游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",sans-serif;
	color:#1F1E1E;
	height:100%;
	padding:0;
	margin:0;
}
img {
	max-width:100%;
	height: auto;
}
.ie8 img {
	width:auto;
}
/*clearfix*/
.clearfix {
	zoom:1;
}
.clearfix:after {
	content: "";
	display:block;
	clear:both;
}

/*初期設定
----------------------------------------------------*/
p {
	word-break: normal;
    word-wrap: break-word;
	line-height:1.8;
}
a {
    background: transparent none repeat scroll 0 0;
    color: #666;
    font-size: 100%;
    margin: 0;
    padding: 0;
    text-decoration: none;
    transition: all 0.4s ease-out 0s;
    vertical-align: baseline;
	outline:none;/*リンククリック時の点線消去*/
}
a.clr-wht {
	color:#fff;
}
a:focus, *:focus { 
    outline:none;/*リンククリック時の点線消去*/
}
ul {
	margin:0;
	padding:0;
}
li.on a {
    opacity: 0.6;
	color:#0f2e49;
}
li {
	list-style:none;
	padding:0;
	margin:0;
}
h1,h2,h3,h4,h5,p {
	margin:0;
	padding:0;
}
#wrapper {
	width: 100%;
}
.only-pc {/*メニューPC表示OFF*/
	display:none;
}
.only-sp {/*メニューSP表示ON*/
	display:block;
}
/*メニュートグル
----------------------------------------------------*/
#toggle {
	display:block;
	width:50px;
	height:50px;
	margin:0 auto 3rem auto;
	text-align:center;
	color:#131313;
	background-color:#f6f6f6;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;

}
.toggle-text {
	font-size:14px;
	font-weight:bold;
	color:#8B5E28;
	padding-top:0;
	margin-top:0;
	line-height:50px;
	font-family: 'Work Sans', sans-serif;
}
/*メニュートグル2：workのシングルページ
----------------------------------------------------*/
#toggle2 {
	display:block;
	width:100%;
	margin:2rem auto;
	text-align:center;
	color:#666;

}
.toggle-text2 {
	font-size:14px;
	color:#666;
	padding-top:0;
	margin-top:0;
	font-family: 'Work Sans', sans-serif;
}

/*header
----------------------------------------------------*/
header {
	width:100%;
	padding:2rem 0 3rem;
}


header h1 {
	margin:0 ;
	line-height: 1;
	font-weight: normal;
	color:#666;
	text-align:center;
	font-family: 'Josefin Sans', sans-serif;

}
header h1 #titleSub {
	font-size:16px;
	font-size:1.6rem;
	letter-spacing:0.15rem;
}

header h1 #titleName {
	font-size:32px;
	font-size:3.2rem;
	padding-top:1.4rem;
	letter-spacing:0.1rem;
	padding-bottom:8px;
}
	/*header：ロゴまわり：min-width 800pxまで共通
----------------------------------------------------*/
#header-area {
	width:150px;
	height:150px;
    margin:0 auto;
	}
.logomark{
	width:150px;
	margin:0 auto;
	display:block;

	} 

/*共通
----------------------------------------------------*/
#content {
	padding: 0 10px;
	margin-bottom:30px;
}


nav ul {
	margin:0;
	padding:0;
}
#menu_main .menu-list {
    float: none;
	width: 100%;	
	letter-spacing:0.1rem;
	padding-top:6px;
	padding-bottom:6px;
	border-bottom: 1px dotted #e8e8e8;
	text-align:center;
	font-family: 'Work Sans', sans-serif;
	font-size:20px;
}


#menu_main {
	display:none;
	border-top: 1px dotted #e8e8e8;
	padding:0 0 1rem;
	margin-bottom:2rem;
	position: absolute; /* トグル開閉に伴う下層コンテンツの上下防止 */
    top: 27rem;         /* ロゴやMENUボタンがあるヘッダーの高さに合わせて数値を調整してください */
    left: 0;
    width: 100%;       /* メニューの横幅を画面いっぱいに広げる */
    z-index: 9999;     /* 下の画像や文字より手前に表示させる */
    background-color: rgba(255,255,255,0.95); /* 必要に応じて背景色を設定（透けないようにするため） */
}
#contentArea {
	padding: 0;
}
#ImageArea {
	margin-bottom:40px;
	width:100%;
}
/*下層ページ
----------------------------------------------------*/
.wrap-contents {
	margin-top:0;
}
.cont-left {
	width:100%;/*180px*/
}
.cont-right {
	width:100%;
	margin-top:2rem;
}
.content-title {
	font-weight:normal;
	font-size:24px;
	font-size:2.4rem;
	font-family: 'Work Sans', sans-serif;
	line-height:1;
	letter-spacing:0.1rem;
	text-align:center;
}

/*Homeページ
----------------------------------------------------*/
.home.rslides img {
   max-height:653px;
   width:auto;
}


/*Aboutページ
----------------------------------------------------*/
.aboutWrap {
	/*background-image: linear-gradient(-90deg, #f9f9f9, #ffffff);*/
    background:-webkit-gradient(linear, left top, right bottom, color-stop(0.4, #fff), color-stop(0.9, #f9f9f9), color-stop(1, #f1f1f1));
    background:-webkit-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-moz-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-o-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:linear-gradient(to right bottom, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
}
.aboutText {
	padding-top:0;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:30px;
	line-height:2;
}


/*Worksページ
----------------------------------------------------*/
.workWrap {
	width:100%;
}
.work-list {
	display:block;
	width:90%;
	height:auto;
	float:none;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:20px;
	position:relative;
	overflow: hidden;
}
.work-list-title {
	position:absolute;
	top:50%;
	text-align:center;
	color:#000;
	font-family: 'Work Sans', sans-serif;
	font-size:2rem;
	margin-top:-1.6rem;
	width:100%;
	opacity: 0.4;	
}
#menu_cate {
	display:block;
	margin:2rem auto 0 auto;
	width:90%;
}
#menu_cate ul li {
	display:block;
	text-align:center;
	width:30%;
	margin-left:2.5%;
	float:left;
	padding-bottom:1rem;
}
.cate-list {
	font-size:14px;
	font-size:1.4rem;
	font-family: 'Work Sans', sans-serif;
	letter-spacing:1px;
	padding:0;
	line-height:14px;
}
	
.cate-list.on {
	border-bottom: #DEC16C dotted 1px;
	padding:0 0 8px 0;
}
/*Works-cateページ
----------------------------------------------------*/
.work-photo img {
	display:block;
	max-width:80%;
	float:none;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:2rem;
	border: 3px solid #f7f7f7;
}
.work-single img {
	display:block;
	max-width:31%;
	float:left;
	margin-left:1%;
	margin-right:1%;
	margin-bottom:16px;
}
.work-single-W100 img {
	display:block;
	max-width:31%;
	float:left;
	margin-left:1%;
	margin-right:1%;
	margin-bottom:16px;
}

.back-cate-archive {
	text-align:center;
}
/*movieページ
----------------------------------------------------*/
.movie-box {
    width:90%;
    height:30rem;
	margin:0 auto;
	padding:0;
    background:-webkit-gradient(linear, left top, right bottom, color-stop(0.4, #fff), color-stop(0.9, #f9f9f9), color-stop(1, #f1f1f1));
    background:-webkit-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-moz-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-o-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:linear-gradient(to right bottom, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
}
.movie-title {
	font-weight:normal;
	font-size:16px;
}
.movie-text {
	text-align:center;
	line-height:30rem;
	letter-spacing:2px;
}
/*footerエリア
----------------------------------------------------*/
#footerArea {
	text-align:center;
	padding-bottom:12px;
	padding-top:30px;
}
/*media Queries
----------------------------------------------------*/
@media only screen and (min-width: 480px) {
header {
	width:100%;
	padding:1rem 0 1rem;
}
header h1 {
	color:#666;
	text-align:center;
	padding-left:0;
}	

#ImageArea {
	margin-bottom:40px;
	width:92%;
	margin:0 auto;
}


/*Worksページ
----------------------------------------------------*/
.workWrap {
	width:100%;
}
.work-list {
	display:block;
	width:42%;
	height:auto;
	float:left;
	margin-left:3.99%;
	margin-right:3.99%;
	margin-bottom:20px;
	position:relative;
	overflow:hidden;
}
.work-list-title {
	position:absolute;
	top:50%;
	text-align:center;
	color:#000;
	font-family: 'Work Sans', sans-serif;
	font-size:2rem;
	margin-top:-1rem;
	width:100%;
	opacity: 0.4;	
}

	}/*mediaクリエ終了 min-width 480px
----------------------------------------------------*/

@media screen and (min-width: 800px) {
#toggle {/*メニュートグル：PC非表示*/
	display:none;
}
#toggle2 {/*メニュートグル：PC非表示*/
	display:none;
}
.only-pc {/*メニューPC表示OFF*/
	display:block;
}
.only-sp {/*メニューSP表示ON*/
	display:none;
}
/*TOPページ wrapper
----------------------------------------------------*/
#wrapper {
		width: 800px;
		margin:0 auto;
}
/*worksページ wrapper
----------------------------------------------------*/
#work #wrapper {
		width: 1280px;
		margin:0 auto;
}	
	
/*TOPページ header：ロゴまわり
----------------------------------------------------*/
#header-area {
	width:263px;
	height:240px;
    margin:0 auto;
	}
#logoWrap {
	width:263px;
	height:220px;
	margin:0 auto;
	background-image: url(../img/logo-background.png);
	background-size: auto 80%;
	background-position: center;
	background-repeat: no-repeat;
	}
.logomark{
	width:150px;
	margin:26px auto 0 auto;
	display:block;

	} 
/*worksページ header：ロゴまわり
----------------------------------------------------*/
#work #header-area {
	width:1040px;
	height:140px;
    margin:0 auto;
	}
#work #logoWrap {
	width:150px;
	height:auto;
	background-image: none;
	background-size: 0;
	background-position: 0;
	background-repeat: no-repeat;
	}
#work .logomark{
	width:150px;
	margin:0px auto 0 auto;
	display:block;

	} 
/*TOPページのcontentArea
----------------------------------------------------*/
#contentArea {
	width: 800px;
	margin:0 auto;
	}
#menu_main {
	display:none;
	border-top: 1px dotted #e8e8e8;
	padding:0 0 1rem;
	position:relative;/*トグルの開閉による下層コンテンツの上下防止*/
	margin-bottom:2rem;
	width:800px;
	top:auto;/*トグルの開閉による下層コンテンツの上下防止*/
}
/*WORKSページのcontentArea
----------------------------------------------------*/	
#work #contentArea {
	width: 1040px;
	margin:0 auto;
	}
#work #menu_main {	
	width:800px;
	margin-left:240px;
}

.menu-list {
	background-repeat: no-repeat;
	margin-top:8px;
	margin-bottom:12px;
	}
.menu-list.image-A {
	background-image: url("../img/menu-image_moon.jpg");
	background-size: auto 70%;
	background-position: bottom 6px left 2px;
	}
.menu-list.image-B {
	background-image: url("../img/menu-image_sankaku.jpg");	
	background-size: auto 40%;
	background-position: bottom 10px left 0px;
	}
.menu-list.image-C {
	background-image: url("../img/menu-image_insect.jpg");
	background-size: auto 40%;
	background-position: bottom 15px left 0px;
	}
.menu-list.image-D {
	background-image: url("../img/menu-image_tent.jpg");
	background-size: auto 58%;
	background-position: bottom 8px left 0px;
	}
.menu-list.image-E {
	background-image: url("../img/menu-image_bird.jpg");
	background-size: auto 80%;
	background-position: bottom 0px left 12px;
	}
#work .menu-list.image-E {
	background-image: url("../img/menu-image_bird.jpg");
	background-size: auto 82%;
	background-position: bottom 0px left 10px;
	}
.menu-list.image-F {
	background-image: url("../img/menu-image_mountain.jpg");
	background-size: auto 40%;
	background-position: bottom 11px right 0px;
	}
#work .menu-list.image-F {
	background-image: url("../img/menu-image_home.jpg");
	background-size: auto 53%;
	background-position: bottom 4px right 9px;

	}
#work .menu-list.image-F a {
	color:#fff;
	text-align:right;
	}
#work .wrap-contents {
	width:100%;	
	}
#work .cont-left {
	width:240px;/*180px*/
	float:left;
}
#work .cont-right {
	width :76.826% ; /* IE8以下とAndroid4.3以下用フォールバック：1040／800-1px=76.826% */
    width : -webkit-calc(100% - 180px) ;
    width : calc(100% - 240px) ;
	float:right;
	margin-top:0;
	margin-bottom:48px;
}
/*header
----------------------------------------------------*/
header {
	width:100%;
	padding:0;
	height:120px;
}
header h1 {
	text-align:left;
	padding-left:0;
	width:400px;
	float:left;
}
header h1 #titleSub {
	font-size:18px;
	font-size:1.8rem;
	letter-spacing:0.15rem;
}

header h1 #titleName {
	font-size:36px;
	font-size:3.6rem;
	letter-spacing:0.1rem;
	padding-bottom:8px;
	padding-top:26px;
}
header .header-R {
	width:300px;
	float:right;
}
header .header-R.portrait {
	width:96px;
	padding-top:18px;
}
nav#menu_main ul li.calendar {
	text-align:left;
}
nav {
	margin:0;
	padding:0;
}
.home {
	display:block;
}
a:hover {
    cursor: pointer;
    opacity: 0.5;
	color:#0f2e49;
}




#content{
	width:100%;
	padding:0;
	margin:0;
}
.wrap-menu {
	width:100%;
	padding:0;
	margin:0;
}
#menu_main {
	display:block;
	width:100%;
	padding:0;
	height:auto;
	margin:0;
	border:none;
}
#menu_main .menu-list {
    float: left;
	text-align:left;
	border:none;
	letter-spacing:0.1rem;
	padding-top:0;
	padding-bottom:0;
	/*font-family: "Raleway";*/
	font-family: 'Work Sans', sans-serif;
	font-size:12px;
	font-weight:bold;
}
	#menu_main .menu-list {
	height:32px;
	padding-top:34px;}

#menu_main .menu-list.listA {
	width:86px;
	padding-left:38px;/*メニューリストのwidth:計124px*/
}
#menu_main .menu-list.listB {
	width:78px;
	padding-left:58px;}/*メニューリストのwidth:計136px*/
#menu_main .menu-list.listC {
	width:112px;
	padding-left:68px;}/*メニューリストのwidth:計180px*/

#menu_main .menu-list.listD {
	width:112px;
	padding-left:36px;}/*メニューリストのwidth:計148px*/
#menu_main .menu-list.listE {
	width:100px;}
#menu_main .menu-list.listF {
	width:58px;
	padding-left:43px;}


.wrap-contents {
	width:100%;
	margin-top:16px;
}
#ImageArea {
	margin:0 0 10px 0;
	padding:0;
	width:100%;
}

.toHome {
	display:none;
}

/*下層ページ
----------------------------------------------------*/
.cont-left {
	width:180px;/*180px*/
	float:left;
}
.cont-right {
	width:619px;
	float:right;
	margin-top:0;
	margin-bottom:48px;
}
.content-title {
	font-weight:normal;
	font-size:24px;
	font-family: 'Work Sans', sans-serif;
	line-height:1;
	letter-spacing:0.1rem;
	text-align:left;
}
#work-cate .content-title, #work-single .content-title {
	border-left:none;
}

/*Aboutページ
----------------------------------------------------*/
#about .wrap-contents {
	width:100%;
	margin-top:38px;
}

.aboutWrap {
	/*background-image: linear-gradient(-90deg, #f9f9f9, #ffffff);*/
    background:-webkit-gradient(linear, left top, right bottom, color-stop(0.4, #fff), color-stop(0.9, #f9f9f9), color-stop(1, #f1f1f1));
    background:-webkit-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-moz-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-o-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:linear-gradient(to right bottom, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
}
.aboutText {
	padding-top:0;
	padding-left:0;
	padding-right:12px;
	padding-bottom:30px;
	line-height:2;
}
/*Workページ
----------------------------------------------------*/
#work .wrap-contents {
	width:100%;
	margin-top:38px;
}
#work-single .wrap-contents {
	width:100%;
	margin-top:38px;
}
.workWrap {
	width:100%;
	margin-bottom:38px;
}
/*workページ（念のため）
.work-list {
	position:relative;
	width:31.41%;
	height:252px;
	float:left;
	margin-left:15px;
	margin-right:0;
	margin-bottom:15px;
	overflow:hidden;
	background-color:#f7f7f7;
	padding:0;
}
.work-list img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  max-height:100%;
}
.work-list-title {
	position:aboulute;
	top:92%;
	text-align:right;
	color:#000;
	font-family: 'Work Sans', sans-serif;
	font-size:16px;
	width:232px;
	margin-bottom:20px;
	opacity: 0.7;	
}
.work-list-title .color-white {
	color:#fff;
}*/
/*Work-cateページ
----------------------------------------------------*/
#menu_cate {
	display:block;
	margin:32px 0 0 0;
	width:100%;
}
#menu_cate ul li {
	display:block;
	text-align:left;
	width:100%;
	padding-bottom:0;
	margin:0 0 22px 0;
	float:none;
}
.cate-list {
	font-size:16px;
	font-family: 'Work Sans', sans-serif;
	letter-spacing:1px;
	padding:0;
	line-height:16px;
}
	
.cate-list.on {
	border-left: #DEC16C dotted 1px;
	border-bottom:none;
	padding:0 0 0 8px;
}	

.work-photo img {
	display:block;
	max-height:380px;/*WORKSページサムネイル画像の画角：正方形=１：１（380×380）／横長=１：２.０５（縦380×横779／780までOK）----------------------------------------------------*/
	max-width:780px;
	float:left;
	margin-left:0;
	margin-right:18px;
	margin-bottom:16px;
	border:1px solid #f0f0f0; 
}
.work-single img {
	display:block;
	max-width:140px;
	max-height:93.4px;
	float:left;
	margin-left:16px;
	margin-right:0;
	margin-bottom:16px;
}
.work-single-W100 img {
	display:block;
	width:100%;
	max-width:100%;
	margin-left:0;
	margin-right:0;
	margin-bottom:16px;
}
.back-cate-archive {
	text-align:right;
	padding:0;
}
/*movieページ
----------------------------------------------------*/
.movie-box {
    width:100%;
    height:420px;
	margin:0;
	padding:0;
    background:-webkit-gradient(linear, left top, right bottom, color-stop(0.4, #fff), color-stop(0.9, #f9f9f9), color-stop(1, #f1f1f1));
    background:-webkit-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-moz-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:-o-linear-gradient(left top, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
    background:linear-gradient(to right bottom, #fff 40%, #f9f9f9 90%, #f1f1f1 100%);
}
.movie-title {
	font-weight:normal;
	font-size:16px;
}
.movie-text {
	text-align:center;
	line-height:420px;
	letter-spacing:2px;
}

/*contactページ
----------------------------------------------------*/

/*footerレイアウト*/

#footerArea {
	width:800px;
	margin:0 auto;
	padding-top:120px;
	padding-bottom:60px;
}
#home .copyright {
	display:block;
	text-align:center;
	padding-right:0;
}
.copyright {
	display:block;
	text-align:right;
	padding-right:0;
}
	
	}/*mediaクリエ終了 min-width 800px
----------------------------------------------------*/
	
	
@media screen and (min-width: 1280px) {
/*wrapper
----------------------------------------------------*/
#wrapper {
		width: 1280px;
		margin:0 auto;
}

/*メニュー左寄せ＋左メニュW180px＋画像余白19px
#work #menu_main {
	width:476px;
	float:left;
	margin-left:199px;
}
#work #menu_main .menu-list {
	text-align:left;
}
#work #menu_main .menu-list.home {
	padding-left:0;
}
#work .cont-left {
	width:180px;
	float:left;
}
#work .cont-right {
	width : 85.9365% ;
    width : -webkit-calc(100% - 180px) ;
    width : calc(100% - 180px) ;
	float:right;
	margin-top:0;
	margin-bottom:48px;
}
----------------------------------------------------*/

.worksWrap ul {
	padding-top:30px;
}
/*footerレイアウト*/

#work #footerArea {
	width:80%;
	margin:0 auto;
	padding-top:0;
}
#work .copyright {
	display:block;
	text-align:right;
	padding-right:0;
}
	
	}/*mediaクリエ終了 min-width 1280px
----------------------------------------------------*/