﻿@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Philosopher&display=swap');

/* 基本レイアウト ここから↓ */



body{

	padding:0;

	margin:0;

	background:#06101a;

}

header{

	position:relative;

	width:100%;

	height:120%;

}

::-webkit-scrollbar {

    width: 3px;

}

 

::-webkit-scrollbar-track {

    background-color:#3e3e3e;

}

 

::-webkit-scrollbar-thumb {

    background-color:897858;

    border-radius: 7px;

}

.slide img{

	position:absolute;

	width:100%;

	height:80%;

	opacity:0;

	transition:all 1s ease-in-out;

	

}

header .top_text{

	margin:0;

	padding:0;

}

header .top_text p.top{

	position: absolute;

        top: 26%;

        left: 38%;

  	transform: translate(-10%, -40%);

	color:white;

	font-size:clamp(70px,7.5vw,150px);

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	font-feature-settings:"palt";

	line-height:50px;

}

header .top_text p.top_syousya{

	position: absolute;

        top: 32%;

        left: 44%;

	font-size:clamp(23px,2vw,50px);

	color:white;

	font-family:"HG行書体";

	letter-spacing: 0.2em;

}

img.sekiju_logo1{

	width:9.5vw;

	height:auto;

}

header p.top_com{

	 position: absolute;

    top: 60%;

    left: 50%;

  	 transform: translate(-50%, -50%);

	-ms-writing-mode: tb-rl;

}	

a{

	color:#c9c4b8;

	display: inline-block;

	transition: all .3s ease 0s;

	text-decoration: none;

}

a:hover{

	opacity:0.5;

}

h3{

	font-size:6vw;

	color:70644f;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

span{

	font-size:clamp(11px,1.2vw,16px);

	color:#c9c4b8;

	line-height:2.3vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

h4{

	font-size: min(30px,1.7vw);

    letter-spacing: 0.1em;

    color: #c9c4b8;

    line-height: 4.4vw;

    font-family: "Noto Serif JP",serif;

    font-weight: bold;

}

/* about us ここから↓ */

#about{

	margin:0;

	position:relative;

	width:100%;

	height:70vw;

}

#about .about_jpg{

  	position:absolute;

	top:20%;

	left:7%;

	width:37%;

   height:auto;

}

.box1{

	width:45%;

	height:30%;

	position:relative;

	top:40%;

	left:46%;

}

.box1 h3.aboutus{

	padding-top:22%;

	margin-left:-12%;

	

}

.box1 .about_topic{

	padding-top:10%;

	margin-left:10%;

}

.box1 p.comment1{

	margin-left:10%;

	width:75%;

	height:auto;

}

.box1 p.link_about{

	padding:6% 0 0 40%;

	font-size:1.3vw;

	text-align:center;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

#about div.rinen{

	position:absolute;                  

	top:5%;

	right:4%;

}

.sekiju_png{

	width:23vw;

}

    

/* products ここから↓ */

#products{

	margin-top:10%;

	position:relative;

	width:100%;

	height:70vw;

}

#products .box2{

	width:40%;

	height:40%;

	position:absolute;

	top:30%;

	left:20%;

}

#products .box2 h3.inspired{

	padding-top:20%;

	padding-right:10%;

	text-align:right;

}

#products .box2 .sekisyu_topic{

	padding-top:8%;

}

#products .box2 p.comment2{

	padding-top:0;

	width:75%;

	height:30%;

}	

#products .box2 p.link_products{

	padding-top:15%;

	font-size:1.3vw;

	text-align:center;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

#products p.img02{

	position:absolute;

	top:25%;

	width:100%;

	height:100%;

}

p.img02 img{

	position:absolute;

	right:0;

	width:47%;

	height:68%;

}

div.sekisyu{

	position:absolute;                  

	top:20%;

	left:-3%;

}

.toriatukai_png{

	margin-top:-60%;

	padding-left:15%;

	width:24vw;

}

/* example ここから↓ */

#sekourei{

	margin:0;

	position:relative;

	width:100%;

	height:100vw;

	display:flex;

}

.box3{

	width:80%;

	height:100%;

	position:absolute;

	top:20%;

	left:17.5%;

}

.box3 h3.example{

	margin-left:30%;

	left:40%;

}

.box3 .ex_topic{

	 padding-top:8%;

}

.box3 p.comment3{

	width:80%;

	height:10%;

}	

.box4{

	width:80%;

	height:50%;

	position:relative;

	top:50%;

	left:0;

}

.box4 ul.sekourei_ul{

	display:flex;

	max-width:100%;

	margin:0;

	overflow-x:auto;

}

.box4 ul.sekourei_ul li{

	width:65%;

    margin-right:-22%;

    flex-shrink: 0;

    list-style: none;

}

.box4 ul.sekourei_ul li img{

	width:60%;

    object-fit: cover;

}

.box4 ul.sekourei_ul::-webkit-scrollbar {

  height: 3px; /* スクロールバーの高さ */

}

 

.box4 ul.sekourei_ul::-webkit-scrollbar-thumb {

  background-color:897858; /* ツマミの色 */

  border-radius: 7px; /* ツマミ両端の丸み */

}

 

.box4 ul.sekourei_ul::-webkit-scrollbar-track {

  background-color:#3e3e3e; /* トラックの色 */                 	

  border-radius:7px; /* トラック両端の丸み */

}

.box4 p.link_example{

	padding-top:5%;

	padding-left:73%;

	font-size:1.3vw;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

#sekourei div.example2{

	position:absolute;                  

	left:74.9%;

	top:20%;

}

.sekouzumen_png{

	margin-top:-50%;

	width:25vw;

}

/* topics ここから↓ */

#topics{

	margin-top:10%;

	position:relative;

	width:100%;

	height:35vw;

	display:flex;

}

.box5{

	margin:0;

	position:absolute;

	width:100%;

	height:auto;

}

.box5 h3.topi{

	padding-top:5%;

	padding-left:40%;

}

.topic_box{

	margin-top:15%;

	margin-left:20%;

	width:60%;

	height:auto;

}

.no_topi{

	text-align:center;

	width:75%;

	color: #c9c4b8;

	font-size:clamp(15px,2vw,25px);

	font-family:"HGP教科書体";

	line-height:35px;

}

.topic_box dl{

	text-align:center;

	width:100%;

	font-size:clamp(15px,2vw,25px);

	font-family:"HGP教科書体";

	line-height:35px;

}

.topic_box dl dt{

 float:left;

 padding:5px 0;

 width:7em;

}

.topic_box dl dd{

 border-bottom:1px solid #70644f;

 padding:5px 0 5px 7em;

}

.topic_box dd{

 border-bottom:none;

}

p.link_topics{

	margin:5% 0 0 50%;

	font-size:1.3vw;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

/* contact ここから↓ */

#contact{

	margin-top:10%;

	position:relative;

	width:100%;

	height:50vw;

	display:flex;

}

.box6{

	position:absolute;

	width:100%;

	height:auto;

}

.box6 h3.cont{

	margin-left:40%;

	

}

.box6 p.comment4{

	padding-left:15%;

	padding-top:5%;

	width:85%;

	height:40%;

	text-align:center;

}

.box6 p.link_contact{

	margin-top:5%;

	padding-left:55%;

	font-size:1.5vw;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}







/**-----取扱い石種ページここから(stones.php)-------**/



#products_page{

	margin:0;

	position:relative;

	width:100%;

	height:90vw;

}

#products_dome_page{

	margin:0;

	position:relative;

	width:100%;

	min-height:260vw;

	max-height:850vw;

}

#products_inter_page{

		margin:0;

	position:relative;

	width:100%;

	min-height:555vw;

	max-height:800vw;

}

#topi_page{

	margin:0;

	position:relative;

	width:100%;

	height:70vw;

}

.products_inspired{

	padding:10% 0 0 5%;

	font-size:7vw;

	color:70644f;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

.products_comment{

	margin:-9% 0 0 50%;

	width:40%;

	font-size: min(20px,1.1vw);

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:2.5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

.topic_comment{

	margin:-4% 0 0 50%;

	width:45%;

	font-size: min(20px,1.1vw);

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:2.5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

.site_name{

	margin-left:10%;

	 -ms-writing-mode: tb-rl;

  writing-mode: vertical-rl;

	color:#70644f;

	font-size:1.5vw;

	font-family: "Noto Serif JP",serif;

}

	

.products_sekisyu{

	margin-top:10%;

	position:relative;

	width:90%;

	height:50vw;

	display:flex;

}

.products_list{

	margin-top:10%;

	margin-left:8%;

	position:relative;

	width:80%;

	height:auto;

}

.dome{

	margin:10% 0 0 10%;

	position:relative;

	width:35%;

	height:40vw;

}

.link_dome{

	padding-left:25%;

	font-size:min(20px,2vw);

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

.img_dome img{

	width:100%;

	height:auto;

	opacity:0.5;

}

.inter{

	margin:8% 0 0 15%;

	width:40%;

	height:40vw;

}

.link_inter{

	padding:5%;

	font-size:min(20px,2vw);

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

.img_inter img{

	margin-top: -10%;

    width: 90%;

    height: auto;

    opacity: 0.5;

}

.country{

	margin-left:10%;

	font-size:2.5vw;

	color:#c9c4b8;

	border-top:1px solid #c9c4b8;

	border-bottom:1px solid #c9c4b8;

	text-align:center;

	letter-spacing:0.5em;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

.p_gohome{

	margin-top:5%;

	text-align:center;

}

ul.stones{

 	display: flex;

	flex-wrap: wrap;

	justify-content: center;

   	margin-left: 15%;

	padding-top:10%;

   	list-style: none;

	width:80%;

	height:auto;

	color:#c9c4b8;

	font-size:clamp(11px,1.2vw,16px);

	line-height:2vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;



}

ul.stones li{

	padding:2% 2% 10% 2%;

	text-align:center;

	width:25%;

}

ul.stones li img{

	width:100%;

	height:169px;

}

.goback{

	margin:15% 0 0 80%;

	margin-bottom:5%;

}

#syosai_page{

	margin:0;

	position:relative;

	width:100%;

	height:70vw;

}

.syosai_name{

	padding-top:5%;

	text-align:center;

	font-size:5vw;

	color:#70644f;

	font-family:"Noto Serif JP",serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

.syosai_box{

	margin:0;

	padding:0;

	position:relative;

	width:80%;

	height:auto;

	display:flex;

}

.syosai_img{

	width:20%;

	height:auto;

	margin:10% 0 0 40%;

}

.syosai{

	color:#c9c4b8;

	font-size:clamp(11px,1.5vw,16px);

	line-height:3vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

	margin:10% 0 0 10%;

}

.syosai_topi{

	width: 80%;

    text-align: center;

    margin-top: 10%;

    margin-left: 10%;

    color: #c9c4b8;

    font-size: clamp(11px,1.5vw,16px);

    line-height: 3vw;

    font-family: "Noto Serif JP",serif;

    font-weight: bold;

}

.syosai_goback{

	margin:15% 0 0 45%;

	margin-bottom:5%;

}

/*footerここから*/

footer{

	margin-bottom:0;

	position:relative;

	width:100%;

	height:30vw;

	display:flex;

	background-color:gray;

	font-family:"HGP教科書体";

}

.box7{

	position:absolute;

	width:100%;

	height:30vw;

}

.com{

	position:absolute;

	width:100%;

	height:auto;

	padding-top:5%;

	text-align:center;

}	

.com p.com_ltd{

	font-size:2vw;

	color:#c9c4b8;

	font-weight:bold;

}

.com p.com_ltd span.sekiju{

	font-size:3vw;

	color:#c9c4b8;

	font-weight:bold;

	font-family:"HGP教科書体";

}

p.add{

	padding-top:11%;

	text-align:center;

	font-size:clamp(11px,1.2vw,16px);

	color:#c9c4b8;

	font-weight:bold;

}

p.tel_fax{

	text-align:center;

	font-size:clamp(11px,1.2vw,16px);

	color:#c9c4b8;

	font-weight:bold;

	letter-spacing:0.1em;

}

footer ul{

	padding:5% 0 0 20%;

	width:80%;

}

footer ul#com_nav{

	list-style: none;

	font-size:1.5vw;

	display:flex;

}

footer ul#com_nav li{

	width:50%;

	text-align:center;

}

footer ul#com_nav li a{

	text-decoration:none;

	color:#c9c4b8;

}

footer p.copyright{

  	padding:7% 0 0 30%;

	width:80%;

	font-size:1.2vw;

	color:#c9c4b8;

	letter-spacing:0.2em;

}



/*--------------------companyここから↓-----------------*/

.companyFont{

	color:#897858;

	padding:10% 0 10% 0;

	font-size:6vw;

}

.companyLogo{

	margin-bottom:8%;

	width:13vw;

}

.CompanyProfile{

	text-align:center;

}

.profileTable{

	font-size:clamp(11px,1.2vw,16px);

	    margin: auto;

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:2.5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

caption{

	font-size:clamp(16px,145vw,20px);

	margin:6% 0 5% 0;

}

.map{

	font-size:clamp(14px,2vw,30px);

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:2.5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

	margin:12% 0 2% 0;

}

.mapGoogle{

	margin:2%;

}

.company_contact{

	margin:8%;

}

.company_cont{

	font-size:6vw;

	color:897858;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

	padding:8% 0 6% 0;

}

.link_contact{

	margin:8% 0 12% 0;

}

/**-----CAD・施工例ページここから(example.html)-------**/



.ce_gohome{

    position: absolute;

    right: 45%;

    bottom: -75%;

}





/**-----施工例ページここから(ex.php)-------**/			

#ex_page{			

	margin:0;		

	position:relative;		

	width:100%;		

	min-height:260vw;		

	max-height:450vw;		

}			

.construction_example{			

	padding:9% 0 0 11%;		

	font-size:8vw;		

	color:#897858;		

	font-family: 'Philosopher', sans-serif;		

	font-style:normal;		

	font-weight:400;		

	line-height:100%;		

	font-feature-settings:"palt";		

}			

.ex_comment{			

	position:absolute;		

	top:8%;		

	/*right:3%;*/		

	left:12%;		

	width:55%;		

	font-size:min(20px,1.1vw);		

	letter-spacing: 0.1em;		

	color:#c9c4b8;		

	line-height:2.5vw;		

	font-family:"Noto Serif JP",serif;		

	font-weight:bold;		

}			

.c_example{			

	float:left;		

	padding-top:10%;		

	-ms-writing-mode: tb-rl;		

	writing-mode: vertical-rl;		

	font-family: "HGP教科書体";		

	font-size: 14vw;		

	color: 2f4f4f;		

	opacity: 0.4;		

	letter-spacing: -0.2em;		

}			

#con_example{			

	margin:0;		

	position:relative;		

	width:90%;		

	height:100vw;		

	display:flex;		

}			

			

.gohome{			

	margin-top:10%;		

	text-align:center;		

}			

ul.ex{			

 	display: flex;		

	flex-wrap: wrap;		

	justify-content: space-between;		

   	margin: 10% ;		

	padding: 10% 0 0 1;		

   	list-style: none;		

	width:70%;		

	height:auto;		

	color:white;		

	font-size:clamp(11px,1.2vw,16px);		

	line-height:2vw;		

	font-family:"Noto Serif JP",serif;		

	font-weight:bold;		

			

}			

			

.ex img{			

	    width: 23vw;		

	    margin-bottom: 9vh;		

			

}			

			

ul.ex li{			

	text-align:center;		

	width:29%;		

}			

ul.ex li img{			

	width:100%;		

	height:80%;		

	margin-left: -105% 50% 79% 10%;		

}			



.ex_goback{

	margin:3% 0 0 72%;

  padding-bottom:5%;



}

#syosai_ex_page{

	margin:0;

	position:relative;

	width:100%;

	height:50vw;

}



.syosai_ex_box{

	margin:0;

	padding:0;

	position:relative;

	width:100%;

	height:auto;

	display:flex;

	justify-content: center;

}

.syosai_ex_img{

	width:100%;

	height:auto;

	margin:15% 20% 15% 20%;

}

.syosai_ex{

	color:white;

	font-size:clamp(11px,1.5vw,16px);

	line-height:3vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

	margin:5% 0 0 10%;

}

.syosai_ex_goback{

	position: absolute;

  top: 90%;

  right: 20%;

}

/**-----CADページここから(cad.php)-------**/

#cad_page{

	margin:0;

	position:relative;

	width:100%;

	min-height:100vw;

	max-height:450vw;

}

.cad_example{

	padding:9% 0 0 11%;

	font-size:8vw;

	color:#897858;

	font-family: 'Philosopher', sans-serif;

	font-style:normal;

	font-weight:400;

	line-height:100%;

	font-feature-settings:"palt";

}

.cad_comment{

	position:absolute;

	top:31%;

	/*right:3%;*/

	left:11%;

	width:55%;

	font-size:min(20px,1.1vw);

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:2.5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

}

.c_example{

	float:left;

	padding-top:10%;

	-ms-writing-mode: tb-rl;

	writing-mode: vertical-rl;

	font-family: "HGP教科書体";

	font-size: 14vw;

	color: 2f4f4f;

	opacity: 0.4;

	letter-spacing: -0.2em;

}

#ca_example{

	margin:0;

	position:relative;

	width:90%;

	height:100vw;

	display:flex;

}



.gohome{

	margin-top:10%;

	text-align:center;

}

ul.cad{

 	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

   	margin: 0 auto;

	padding:20% 0 0 1%;

   	list-style: none;

	width:80%;

	height:auto;

	color:white;

	font-size:clamp(11px,1.2vw,16px);

	line-height:2vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;



}



.cad img{

    width: 23vw;

    margin-bottom: 9vh;

}





ul.cad li{

	padding:12% 0 0 0%;

	text-align:center;

	width:29%;

}

ul.cad li img{

	width:100%;

	height:auto;

	margin-left: 48%;

}

.cad_goback{

	margin:3% 0 0 81%;

  padding-bottom:5%;



}

#syosai_cad_page{

	margin:0;

	position:relative;

	width:100%;

	height:50vw;

}



.syosai_cad_box{

	margin:0;

	padding:0;

	position:relative;

	width:100%;

	height:auto;

	display:flex;

  justify-content: center;

}

.syosai_cad_img{

	width:100%;

	height:auto;

	margin: 15% 20% 15% 10%;

}

.syosai_cad{

	color:white;

	font-size:clamp(11px,1.5vw,16px);

	line-height:3vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

	margin:5% 0 0 10%;

}

.syosai_cad_goback{

	position: absolute;

  top: 90%;

  right: 10%;

}









/*----------CONTACTのページはここから↓--------------*/

.otoiawase{

	float:left;

	writing-mode: vertical-rl;

	font-family: "HGP教科書体";

	font-size: 14vw;

	color:#2f4f4f;

	opacity: 0.4;

	letter-spacing: -0.2em;

	height:810px;

	margin-top:10%;

}

.contact_re{

	padding:0 0 10% 0;

	text-align:center;

}

.contactFont{

	text-align:center;

	color:#897858;

	padding:10% 0 0 0;

	font-size:6vw;

}

.contact_form{

	margin:8%;

	padding-rignt:7%;

}

.required::after {

  content: " *";

  color: red;

  vertical-align: middle;

}

.contactTable{

	margin:auto auto 3vw auto;

	border-spacing:50px 30px;

}

.txt{

	border:1px solid #c9c4b8;

	background:#c9c4b8;

	height:3vw;

	width:26vw;

	box-sizeing:inherit;

}

.txtarea{

	height:8vw;

	width:30vw;

	background:#c9c4b8;

}



.btn-center{

	text-align:center;

	margin:0 0 5vw 0;	

}

.button {

  display       : inline-block;

  font-size     : 12pt;        /* 文字サイズ */

  text-align    : center;      /* 文字位置   */

  cursor        : pointer;     /* カーソル   */

  padding       : 12px 100px;   /* 余白       */

  background    : #00913;     /* 背景色     */

  color         : #c9c4b8;     /* 文字色     */

  line-height   : 1em;         /* 1行の高さ  */

  transition    : .3s;         /* なめらか変化 */

  border        : 2px solid #c9c4b8;    /* 枠の指定 */

}

.button:hover {

  opacity       : 0.1;           /* カーソル時透明度 */

}

.contact_telAccess{

	text-align:center;

	padding:5%;

}

p.contact_telNo{

	font-size:clamp(11px,1.4vw,22px);

	letter-spacing: 0.1em;

	color:#c9c4b8;

	line-height:2.5vw;

	font-family:"Noto Serif JP",serif;

	font-weight:bold;

	padding:1%;

}

p.contact_re_head{

    font-size: clamp(13px,1.5vw,20px);

    letter-spacing: 0.1em;

    color: #c9c4b8;

    line-height: 1.7vw;

    font-family: "Noto Serif JP",serif;

    font-weight: bold;

    padding-bottom: 2%;

	padding-top: 6%;

}

p.contact_re_foot{

	padding-top: 1%;

}

.contact_gohome{

    color: white;

    text-decoration: none;

	text-align:center;

	padding-bottom:5%;

}























/*----------文字をスクロールでfadein------------*/

.fadeIn_up {

  opacity: 0;

  transform: translate(0, 50%);

  transition: 2s;

}

.fadeIn_up.is-show {

  transform: translate(0, 0);

  opacity: 1;

}



/*========= スクロールダウンのためのCSS ===============*/





/*=== 9-1-4 矢印が動いてスクロールを促す  ====*/



/*スクロールダウン全体の場所*/

.scrolldown4{

    /*描画位置※位置は適宜調整してください*/

  position:absolute;

  bottom:1%;

  right:10%;

    /*矢印の動き1秒かけて永遠にループ*/

  animation: arrowmove 1s ease-in-out infinite;

}



/*下からの距離が変化して全体が下→上→下に動く*/

@keyframes arrowmove{

      0%{bottom:1%;}

      50%{bottom:3%;}

     100%{bottom:1%;}

 }



/*Scrollテキストの描写*/

.scrolldown4 span{

    /*描画位置*/

  position: absolute;

  left:-30px;

  bottom:10px;

    /*テキストの形状*/

  color: #eee;

  font-size: 0.7rem;

  letter-spacing: 0.05em;

  /*縦書き設定*/

  -ms-writing-mode: tb-rl;

    -webkit-writing-mode: vertical-rl;

    writing-mode: vertical-rl;

}



/* 矢印の描写 */

.scrolldown4:before {

    content: "";

    /*描画位置*/

    position: absolute;

    bottom: 0;

    right: -6px;

    /*矢印の形状*/

    width: 1px;

    height: 20px;

    background: #eee;

    transform: skewX(-31deg);

}



.scrolldown4:after{

  content:"";

    /*描画位置*/

  position: absolute;

  bottom:0;

  right:0;

    /*矢印の形状*/

  width:1px;

  height: 50px;

  background:#eee;

}





/*　トップページのロゴ　*/

.s_logo {

    z-index: 150;

    display: block;

    position: fixed;

    vertical-align: top;

	top:2%;

	left:1%;

}

.s_logo img {

    position: absolute;

	width:5vw;

	height:auto;

}

.s_logo_mobile{

	display:none;

}

/*　ハンバーガーボタン　*/

.right_top{

	display : block;

 	position: fixed;

  z-index : 3; /* 重なり3番目 */

  right : 50px;

  top   : 30px;

  width : 50px;

  height: 300px;

  text-align: center;

}

.hamburger {

   right : 50px;

  top   : 30px;

  width : 50px;

  height: 50px;

  cursor: pointer; /* ポインタ：手の形に変わる */

  text-align: center;

}

.hamburger span {

  display : block;

  position: absolute;

  width   : 30px;

  height  : 2px ;

  left    : 6px;

  background : #FFF;

  -webkit-transition: 0.3s ease-in-out;

  -moz-transition   : 0.3s ease-in-out;

  transition        : 0.3s ease-in-out;

}

.hamburger span:nth-child(1) {

  top: 10px;

}

.hamburger span:nth-child(2) {

  top: 20px;

}

.hamburger span:nth-child(3) {

  top: 30px;

}



/* ナビ開いてる時のボタン */

#wrap {

	width: 100%;

	margin: 0 auto;	

}



.hamburger.active span:nth-child(1) {

  top : 16px;

  left: 6px;

  background :#fff;

  -webkit-transform: rotate(-45deg);

  -moz-transform   : rotate(-45deg);

  transform        : rotate(-45deg);

}



.hamburger.active span:nth-child(2),

.hamburger.active span:nth-child(3) {

  top: 16px;

  background :#fff;

  -webkit-transform: rotate(45deg);

  -moz-transform   : rotate(45deg);

  transform        : rotate(45deg);

}



nav.globalMenuSp {

  position: fixed;

  z-index : 2; /* 重なり2番目 */

  top  : 0;

  right : 0;

  color: #fff;

  background: #000913;

  text-align: left;

  width: 100%;

	height: 100%;

  opacity: 0;

  transition: opacity .6s ease, visibility .6s ease;

	display:flex;

	flex-wrap:wrap;

  flex-direction: row-reverse;

	font-size:30px;

	font-family:"游明朝";

	line-height:30px;

	visibility:hidden;

	}



nav.globalMenuSp ul {

  /*padding: 0;

  margin-left: 50px;

  margin-top: 19%;*/

}





nav.globalMenuSp ul li {

  list-style-type: none;

  padding: 5px;

  width: 100%;

  transition: .4s all;

}

nav.globalMenuSp ul li:last-child {

  padding-bottom: 0;

}





nav.globalMenuSp ul li a {

  display: block;

  color: #fff;

	opacity:1;

  padding: 0.5em 0;

  text-decoration :none;

  font-size:2.35vw;

}



nav.globalMenuSp ul li a:hover {

  color :#70644F;

  opacty:1;

}



nav.globalMenuSp div.pic {

	display: flex;

   justify-content: center;

   align-items: center;

}



nav.globalMenuSp div.pic img {

    position: absolute;

    /* top: 10%; */

    left: 19%;

    width: 25vw;

    height: 38vw;

}



nav.globalMenuSp div.list {

    display: flex;

    width: 100%;

    height: 100%;

    position: absolute;

    left: 20%;

    align-items: center;

    justify-content: center;

}



img.bigtext{

	/*margin-top:-60%;

	padding-left:15%;*/

	width:30%;

}



.img_ex1 img{

	width:100%;

	height:auto;

	opacity:0.5;

}



.img_ex2 img{

	width:100%;

	height:auto;

	opacity:0.5;

}







/* このクラスを、jQueryで付与・削除する */

nav.globalMenuSp.active {

  opacity: 100;

	visibility: visible;



}









