/*@import url("style-700.css");*/

@charset "utf-8";
/* CSS Document */


/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

/*==== HTML5 スタイルシートのリセット =====*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    /*font-size:100%;*/
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
/*ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}*/

/* change colours to suit your needs */
/*mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}*/

/* change border colour to suit your needs */
/*hr {
    display:block;
    height:1px;
    border:0;  
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}*/

/*input, select {
    vertical-align:middle;
}
*/

/*==============HTML5 スタイルシートのリセット ここまで===================*/




/*++++ タップしてメッセージを表示する記述 ++++++*/
@media (hover: hover) {
   /*ホバーに対応しているデバイスPCを想定したスタイル */
   .midashi:hover + .message{
	display:block;
	} /**/
  .midashi:active + .message{
	display:block;
	} /**/
	}

@media (hover: none) {
   /*ホバーに対応していないスマホ(タッチ端末)PCを想定したスタイル */
  .midashi:active + .message{
	display:block;
	} /**/
	}





*{
	margin: 0;
	padding: 0;
}

/*html{height: 100%;}*/

body{
	
	
	font-family: 'Shippori Mincho', serif;
	/*font-family: 'Sawarabi Mincho', serif;*/
	color:#e6e6fa;
	/*font-family:
	"游明朝", "ＭＳ 明朝"
	
	
	"Noto Sans Japanese","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	
	height: 100%;*/
	
	}
/**/
a{
	text-decoration:none;
	color:#e6e6fa;
}
a:hover{
	opacity:0.8;
}
a:link{	text-decoration:none;
	color:#e6e6fa;}
a:active{	text-decoration:none;
	color:#e6e6fa;
	opacity:0.8;
}	
a:visited{text-decoration:none;
	color:#e6e6fa;
}

strong{
	font-weight:normal;
}

/*p{
	font-family: 'Noto Sans JP', sans-serif;
	color:#CCCCCC;
	}*/

html,body,.main-content-wrapper{width: 100%;height: 100%;}
/*section{
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;

}*/

/*.wbg{
	font-family: 'Shippori Mincho', serif;
	color:#333333;

	background-color:#ECFAFD;
	background-image:url('../cnt-bg.png');
	background-repeat: no-repeat;*/
	/*background-position:left bottom;*/
	/*background-attachment:fixed;
	}*/
	
	/*header*/
#header{
	/*content:""; 中身はブランク*/
	position:relative;
	margin:0;

	
	/*==固定==*/
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;/**/
  width:100%;/**/
  
  /*height:100%;
  height:100vh;
  transform: translate3d(0, 0, -1px); 追加 */
  
  background-image: url('../images/head-img3.jpg');
  
  background-attachment: fixed;/**/
  background-position: left top;

  /*background-position: center;*/
  background-size: cover;
  background-repeat: no-repeat;
  
  /* スマホのガタツキ回避 */
  -webkit-backface-visibility:hidden;
  backfce-visibility:hidden;
  overflow:hidden;/**/
 
	-webkit-overflow-scrolling:touch;/**/
	
	
	/* スマホのガタツキ回避(2) 	これを追加で消えた */
	will-change: transform;
}

.head-img{display:none;}

/*
.t_header-img{  
 	width:100%;
 	margin:0;
}*/


.ttext{
	position:absolute;
	color:#e6e6fa;
	
	left:5%;/*7.7right:7%;20px*/
	/*bottom:14%;bottom:8%;10px*/
	top:16%;
	
	display:flex;
	flex-diretion:row;
	justify-content: flex-end;
	
	/*background:blue;*/
}

h1{
	/*font-size:1em;
	font-weight:400;
	position:absolute;
	color:#e6e6fa;

	left:5%;

	top:11%;*/
	font-size:1.5em;
	font-weight:normal;
}
.dotte{
	margin:0 0.3em;
	line-height:2em;
}
.ttl-yoko{
	font-size:1.5em;
	font-weight:normal;
}

.title{
	position:absolute;
	top:21%;
	left:7%;
	font-weight:normal;
}
.wlogo{
	position:absolute;

	left:8%;
	/*bottom:18%;9.5%*/
	top: 8%;
	/*vertical-align:center;*/
	
	/*background:red;*/
}
.wlogo img{
	width:100px;
	padding:2px;
	}

.container{
		/*background:#1E165E;*/
}

.all_contents{
	/*background:#1E165E;*/
	/*background:#1E165E;*/

				/*background:#1E165E;*/
				/*opacity:0.5;*/
					background: linear-gradient( 
												#2B0968,
						#1E1E82,
						#1E1E82,
						#180F5C,
						#181055,
						#1E165E,
						 #1E165E,
						 #191970,
						 #13057B,
						 #320E63
						
						
						/*
						 #422675,
						#1E165E,
						 #1E165E,
						 #24076E,
						 #1E165E,
						 
						
						 #26057A,
						 #1E165E*/
						 );/*260A6E*/
}

.bg_deco{
	
  /*
	position:fixed;
	bottom:0;
	right:0;
	z-index:0;*/
	
/*	background-image:url('../images/f_aor.jpg');
	background-image:url(../images/bg-8.png);
	background-repeat:repeat-x;
	background-attachment:fixed;
	background-position:bottom center;
	*/

	
	/* スマホのガタツキ回避 
  -webkit-backface-visibility:hidden;
  backfce-visibility:hidden;
  overflow:hidden;
 
	-webkit-overflow-scrolling:touch;
*/
}

/*
.menu-w{
	position:absolute;
	left:10%;
	top: 40%;
	}
.menu-line{
	position:absolute;
	left:12%;
	top: 43%;
	width:15px;
	}
.menu-f{
	position:absolute;
	left:10%;
	top: 47%;
	}
	
	
				<p class="menu-w">Works</p>
			<p class="menu-line">|</p>
			<p class="menu-f">Favorite</p>
*/
/*== workエリア ==*/
.wrk_area{
	/*background:#f0ffff;*/
	
	padding-top:50px;
	/*padding-bottom: 30px;90px*/
	
	border-bottom:solid 1px #AAAAAA;

	/*background:url("../images/back-line.png");
	background-position-x:left;
	background-position-y:bottom;
	background-repeat:repeat-x;*/
	

	
	/*-固定-*/
	
 /*+++ WORKSタイトルを縦方向の中央に表示する記述 +++*/
 /*display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;*/
  
  
  /*background-image:url('../cnt-bg.png');*/
  /*background-attachment: fixed;*/
  /*background-position: left top;center*/
  /*background-size: cover;
  background-repeat: no-repeat;
  
  /*margin-top:10px;*/
}

	
	
/*-- 見出し--*/

.cont_title{
	font-size:1.8em;
	letter-spacing:0.2em;
	color:#e6e6fa;/*EEEEEE*/
	font-weight:400;
	text-indent:2em;
	margin-bottom:20px;
	
}

.wrk_contents{
	/*width:80%;*/
	/*background-image:url('../main-bg3.png') ;
	background-repeat:repeat-y;*/
	
	padding:0;/*20px*/
	margin:0 auto;

}
/*.wrk_one{ margin-bottom:20px; }*/

.drow_border_area{
	width:80%;
	margin:0 auto;

	
	border-top:solid 1px #AAAAAA;
	}

.drow_link{
		display:block;
	/*width:80%;
	
	margin:0 auto;
	border-top:solid 1px #AAAAAA;*/
	}


.drow_area{
	display:flex;
	display: inline-flex;
	flex-direction:row;
	justify-content:flex-start;
	align-items:center;
	
	padding:30px;
		width:100%;
}




/*=== ■共通 ===*/
.come_area{
	display:flex;
	display:inline-flex;
	flex-direction:column;
	margin-left:60px;
	
}

/*.come_area{
float:left; background:red; padding:10px;}*/
.come_area h3{ 
	font-size:1.8em;
	letter-spacing:0.1em;
	font-weight:400
	;
	margin-bottom:30px;
	
	}

/*-- Photo --*/
.photo_border_area{
	width:80%;
	margin:0 auto;
	border-top:solid 1px #AAAAAA;
	border-bottom:solid 1px #AAAAAA;
}

.photo_area{
	display:flex;
	display:inline-flex;
	flex-direction:row;
	justify-content:flex-start;
	align-items:center;
	
	padding: 30px;
}

.photo_link{
	display:block;

	/**/
	}
.photo_area img{
	/*width:55%;*/
}



.kaigyou{display:none;}




/*=== SITE ===*/
.wrk_twe{
	/*width:80%;*/
	margin:0 auto;
	padding-top:30px;
	/*border-top:solid 1px #AAAAAA;*/

	}

.siteT-h3{ 
	font-size:1.5em;
	color:#e6e6fa;
	font-weight:400;
	
	text-align:center;	
	margin:0 auto;
	 }
.siteT-p{ 
	color:#e6e6fa;
	font-weight:400;
	
	text-align:center;
	margin:0 auto;
	 }


.site_kome{	
	/*margin-top:5px;
	margin-left:35%;
	
	
	float:left;
	text-align:center;
	margin-bottom:20px;*/

	}

/*--- スクロールエリア ---*/

.site_area{
	display:flex;
	flex-direction:row;

	width:77%;
	margin:0 auto;
	
	overflow-x: scroll;
	flex-shrink: 0;
	
}

.site_area::-webkit-scrollbar {
 	height: 8px; /* スクロールバーの高さ */
 	}

.site_area::-webkit-scrollbar-thumb {
  background: #aaa; /*#5e097b ツマミの色 */
  border-radius: 6px; /* ツマミ両端の丸み */
}


.site_area::-webkit-scrollbar-track {
  background: #ddd; /* トラックの色 */
  border-radius: 6px; /* トラック両端の丸み */
}


.site-slide{
	flex:column;

	padding:20px;
	margin:10px;
	
	text-align:center;/**/
}


h4{
	margin-top:0.5em;
	font-weight:400;
	letter-spacing:0.1em;
}


/*.btn-s{
	max-width:190px;
	max-height:180px;
	}
		*/
	

 
/*.btn-a:hover{
 opacity:1; width:190px; height:180px;

 }

.btn-a:active{

}
*/
/*======BTN=======*/

.btn-s/*,
button.btn */{
  font-size: 1.8rem;/*1.6rem*/
  font-weight: 700;
  line-height: 6em;/*2.5em*/
  position: relative;
  /*padding:3vw 4vw;
  display: inline-block;*/
  /*padding: 0.5rem 0.5rem;1rem 4rem
  padding:10em 10em;*/
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  /*border-radius: 0.5rem;
  border-radius: 100vh;*/
  width:190px;
  height:180px;
 
cursor:default;
}
/*その他と主な共通部分は省略*/

.btn-s{
  overflow: hidden;
  /*padding: 1rem;1.5rem 6rem*/
  /*width:190px;
  width: clamp(1.6rem, 5rem);*/
  /*height:180px;
  height: clamp(1.6rem, 5rem);*/
  /*resize:both;
  overflow:auto;*/
  /*display:inline;*/

  color: #fff;
  border-radius: 0;
  background: #000;
}

.btn-s span {
  position: relative;
}

.btn-a{
	border-bottom:dotted 2px #CCC;
}

.btn-s:before{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;/**/
  height: 100%;/**/
  content: '';
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
  -webkit-transform: translateX(-96%);
  transform: translateX(-96%);
  background: #eb6877;

cursor:default;
}

/*.btn-s:hover:before {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);

}*/

	.btn-s:active:before {
 	 /* スマホの長押しでメニューを表示させない */
	 -webkit-touch-callout: none;
 		pointer-events: none;

 		}


/*#targetElement {
   既定のスタイル 
  background-color: lightblue;
}*/

/*#targetElement.touching {
   指が触れている間のスタイル 
  background-color: orange;
}*/


	
@media (hover: hover) {
   /*hoverが使える端末 PC想定 */
  .btn-s:hover:before {
   -webkit-transform: translateX(0%);
		  transform: translateX(0%);
		  }
}

@media (hover: none) {
   /*hoverが使えない端末 スマホ想定 */

  .btn-s:active:before {
   -webkit-transform: translateX(0%);
		  transform: translateX(0%);
		  }
}


/*================================*/

/*-デジタルアート-*/
.degi_border_area{
	width:80%;
	
	margin-left:auto;
	margin-bottom:0;
	margin-right: auto;
	margin-top:30px;
	
	border-top:solid 1px #AAAAAA;
}

.degi_link{
	display:block;
	/*display:block;
	width:80%;*/

	/*margin-left:auto;
	margin-top: 30px;10px
	margin-right:auto;
	margin-bottom:0;*/

	
	/*border-top:solid 1px #AAAAAA;*/
	}

.degi_area{
	display: flex;
	flex-direction:rew;
	align-items:center;
	
	padding-left:30px;
	padding-top:30px;
	padding-right:30px;
	padding-bottom:30px;
	}
	
.degi_area img{
 /*width:100%;float:right; width:35%;*/}

.degiA-h3{
	color:#e6e6fa;
	font-size:1.8em;
	font-weight:400;
	
	margin-left:2em;
	}



.kaigyou{display:none;}


/*== FAVORITE ==*/
.favo_area{
	/*background:#fff0f5;*/
	padding-top: 70px;
	padding-bottom: 80px;
	
	/*margin-bottom: 60px;*/
	
	/*background-image:url('../fv-bg3.png');
	background-position: center;*/

}

.cont_title{
	margin-bottom:50px;
	
}

.slider-item img{
	width: 99%;
}

.featherlight-content{
	background:blue;
}


/*== FOOTER ==*/
.footer{
	color:#e6e6fa;
	background:#1E165E;/**/
	padding-top:15px;
	padding-bottom:2px;
	
	border-top:solid 1px #AAAAAA;
	
}


.ft-menu{
	width:70%;
	margin: 0 auto;/*
	margin-left: 1em;*/
	display:flex;
	flex-direction:column;
	
	/*flex-wrap: wrap;*/
}

.ft-wks{
	margin-bottom: 0.4em;
	font-size:0.9em;
	letter-spacing:0.3em;
	
	margin-bottom:0em;
	float:left;/**/
}

.ft-wks-menu{
	display:flex;
	flex-direction:row;
	flex-wrap: wrap;
	/*white-space:normal;nowrap*/
	
	margin-bottom:0.5em;
	line-height:1.2em;
}
.ft-wks-menu li{

}
.ft-wks-menu a{ 
	font-size:0.8em;
	white-space:nowrap;normal;/**/
	/*font-size:0.5vw;*/
	
	letter-spacing:0.2em;

}

.ft-fvt{
	font-size:0.9em;
}

.copy{
	width:50%;
	margin:0 auto;
	text-align:center;

	padding-left:0;
	padding-top:20px;
	padding-right:0;
	padding-bottom: 10px;
	
	letter-spacing:0.2em;
	font-size:0.9em;
	color: #e6e6fa;
	
}

.aisatu-area{
	display:flex;
	flex-direction:row;
	justify-content:center;
	width:90%;
	margin:0 auto;
	padding:0;
	color:#1e165e;

	}

.aisatu-ttl{
	
	margin:0;
	padding:0;
	color:#1e165e;/*1e165e*/
	font-size:0.1em;
	width:5%;

}
.aisatu-ttl-kana{
	margin:0;
	padding:0;
	color:#1e165e;/*1e165e*/
	font-size:0.1em;
	width:5%;
}
.aisatu-area .aisatu{

		margin:0 auto;
		padding:0;
		color:#1e165e;/*1e165e*/
		font-size:0.1em;

}

/*	
	box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;

  
  
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
*/

/*
@media screen and (max-width: 1030px){
	.ft-menu{margin-left:50px;}
}*/

/**=====================================**/