@charset "UTF-8";
html { font-size: 62.5%;/*scroll-behavior: smooth;*/}

body {color: #fff;font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size:1.6rem;font-weight:normal;-webkit-text-size-adjust: 100%;width:100%;background:#000 url(../img/common/bg.png) left top no-repeat;background-size:cover;height: 100%;}

a{text-decoration:none;color:#fff;transition:opacity 0.2s linear;-webkit-transition:opacity 0.2s linear;-moz-transition:opacity 0.2s linear;}
a:hover{opacity:0.6;filter:alpha(opacity=60);-moz-opacity:0.6;}

button{transition:opacity 0.2s linear;-webkit-transition:opacity 0.2s linear;-moz-transition:opacity 0.2s linear;}
button:hover{text-decoration:none;opacity:0.8;filter:alpha(opacity=80);-moz-opacity:0.8;}

input[type="submit"]{transition:opacity 0.2s linear;-webkit-transition:opacity 0.2s linear;-moz-transition:opacity 0.2s linear;font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}
input[type="submit"]:hover{text-decoration:none;opacity:0.8;filter:alpha(opacity=80);-moz-opacity:0.8;}
input[type="button"]{transition:opacity 0.2s linear;-webkit-transition:opacity 0.2s linear;-moz-transition:opacity 0.2s linear;font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}
input[type="button"]:hover{text-decoration:none;opacity:0.8;filter:alpha(opacity=80);-moz-opacity:0.8;}
img{max-width:100%;vertical-align:middle;}
.pcnone{display:none!important;}
.spnone{display:block!important;}

img[src$=".svg"] {width: 100%;max-width:100%;height:auto;}

.con_in{max-width:1040px;width:100%;margin:0 auto;padding:0 20px;}

.earth-memory{font-family: 'Earth Memory', sans-serif;}

#gloval-nav {background:#c69c6d;color: #fff;position: fixed;top: 0;left: 0;/*top: 69;right: 0;bottom: 0;*/z-index: 990;display: block;visibility: hidden;flex-direction: column;justify-content: center;align-items: center;opacity: 0;transition: opacity .4s ease, visibility .4s ease;/*margin-top:11px;*/width:100%;overflow-y:auto;height: 100%;/*padding:0 0 71px 0;*/}

#gloval-nav .gloval-nav_in{width:100%;margin:0 auto;display:flex;align-items: center;justify-content: center;height:100%;}
#gloval-nav .gloval-nav_in nav{}

#nav-toggle {display:block;position: fixed;top: 40px;right: 20px;width:45px;height: 20px;cursor: pointer;}
#nav-toggle > div {position: relative;width: 45px;}
#nav-toggle > div span {width: 100%;height: 1.5px;left: 0;display: block;background: url(../img/common/menu.svg) 0 0 no-repeat;background-size:100%;position: absolute;transition: transform .4s ease-in-out, top .5s ease;}
#nav-toggle > div span:nth-child(1) {top: 0;}
#nav-toggle > div span:nth-child(2) {top: 20px;}
.open #nav-toggle span {background: url(../img/common/menu.svg) 0 0 no-repeat;background-size:100%;}
.open #nav-toggle span:nth-child(1) {top: 10px;transform: rotate(45deg);}
.open #nav-toggle span:nth-child(2) {top: 10px;transform: rotate(-45deg);}

#nav-toggle {z-index: 1000;}
#container {z-index: 900;}

#gloval-nav ul {list-style: none;padding:0 20px;}

#gloval-nav ul li{opacity: 0;transition:  transform .4s ease, opacity .2s ease;}
#gloval-nav ul li:last-child{border-bottom:none;}
#gloval-nav li a {display: block;color: #000;text-decoration: none;padding: 20px ;transition: color .4s ease;font-family: 'Earth Memory', sans-serif;font-size:3.0rem;line-height:1.4;}
.open {overflow: hidden;}
.open #gloval-nav {visibility: visible;opacity: 1;}
.open #gloval-nav li {opacity: 1;transform: translateX(0);transition:  transform 1s ease, opacity .9s ease;}


footer {width: 100%;height:143px;}
footer small{display:block;padding:35px 0 30px 0;text-align:center;}
footer .f_link{display:table;;padding:100px 0 0 0;margin:0 auto;font-size:1.4rem;}
footer .f_link a{text-decoration:underline;}

.kv_out{padding:0 20px;}
.kv{max-width:412px;margin:160px auto 0 auto;border-top:1px solid #fff;border-bottom:1px solid #fff;}
.kv h1{text-align-last: justify;display:table;margin:0 auto;font-size:5.1rem;font-family: 'Earth Memory', sans-serif;line-height:1.3;letter-spacing: 0.1em;font-weight:500;padding:45px 20px;}
.kv h1 .emphasis{font-size:6.6rem;color:#c69c6d;letter-spacing: 0.4em;}

.tistyle1{text-align:center;font-size:2.2rem;padding:60px 0 0 0;line-height:2;}
.tistyle2{text-align:center;font-size:1.8rem;padding:0 0 30px 0;font-weight:500;}
.tistyle2 span{font-family: 'Earth Memory', sans-serif;line-height:1.3;font-size:4.0rem;color:#c69c6d;}




#message{background-color:rgba(255,255,255,0.2);border-radius:50px 0 0 50px;max-width:90%;margin:220px 0 0 auto;padding:50px;}
#message h4{font-size:2.3rem;text-align:center;font-weight:500;padding:0 0 60px 0;}
#message .message_box{display:flex;max-width:700px;margin:0 auto;padding:0 0 0 100px;}
#message .message_box .message_box_l{width:200px;flex:none;}
#message .message_box .message_box_r{width:100%;padding:0 0 0 20px;}
#message .message_box .message_box_r h5{font-size:1.5rem;font-weight:500;}
#message .message_box .message_box_r h5 span{font-size:2.1rem;}
#message .message_box .message_box_r p{font-size:1.3rem;padding:15px 0 0 0;}


#design{background-color:rgba(255,255,255,0.2);border-radius:0 50px 50px 0;max-width:90%;margin:90px auto 0 0;padding:50px;}
#design ul{display:table;margin:0 auto;padding:20px 0 0 0;}
#design ul li {font-size: 2.0rem;vertical-align:middle;line-height:1.4;padding:7px 0 7px 15px;text-indent:-15px;}
#design ul li span{font-size:1.2rem;vertical-align:2px;padding:0 5px 0 0;color:#c69c6d;}

#design .step{max-width:525px;margin:0 auto;}
#design .step_in{display:flex;padding:40px 0 0 0;}
#design .step_in div{padding:0 8px 0 8px;}
#design .step p{padding:15px 0 0 0;font-size:2.4rem;text-align:center;}


#creative{background-color:rgba(255,255,255,0.2);border-radius:50px 0 0 50px;max-width:90%;margin:90px 0 0 auto;padding:50px;}

#creative .creative_box_out{max-width:900px;margin:0 auto;}
#creative .creative_box{display:flex;flex-wrap: wrap;margin:-30px 0 0 -40px;}
#creative .creative_box .creative_box_in{width:50%;padding:30px 0 0 40px;}
#creative .creative_box .creative_box_in h4{text-align:center;color:#c69c6d;font-size:1.7rem;padding:0 0 5px 0;}
#creative .creative_box .creative_box_in p{font-size:1.4rem;}


#member{background-color:rgba(255,255,255,0.2);border-radius:0 50px 50px 0;max-width:90%;margin:90px auto 0 0;padding:50px;}
#member .member_box_out{max-width:900px;margin:0 auto;}
#member .member_box{display:flex;flex-wrap: wrap;margin:0 0 0 -40px;}
#member .member_box .member_box_in{width:50%;display:flex;padding:40px 0 0 40px;}
#member .member_box .member_box_in .member_box_in_l{width:130px;flex:none;}
#member .member_box .member_box_in .member_box_in_r{width:100%;padding:0 0 0 20px;}
#member .member_box .member_box_in .member_box_in_r h4{font-size:1.3rem;}
#member .member_box .member_box_in .member_box_in_r h4 span{font-size:2.1rem;line-height:1.4;}
#member .member_box .member_box_in .member_box_in_r p{font-size:1.3rem;padding:10px 0 0 0;}

#contact{background-color:rgba(255,255,255,0.2);border-radius:50px 0 0 50px;max-width:90%;margin:90px 0 0 auto;padding:50px;}
#contact h4{font-size:2.8rem;text-align:center;padding:30px 0 0 0;}
#contact .btn1 a{display:block;font-size:2.3rem;text-align:center;margin:35px 0;background:#8c6239;padding:25px 10px;border-radius:20px;}
#contact .contact_in{max-width:490px;margin:0 auto;}


#about{background-color:rgba(255,255,255,0.2);border-radius:0 50px 50px 0;max-width:90%;margin:90px auto 0 0;padding:50px;}
#about .about_in{max-width:370px;margin:0 auto;font-size:1.5rem;padding:30px 0 0 0;}
#about .about_in dl{display:flex;padding:15px 0 0 0;}
#about .about_in dl dt{width:85px;flex:none;}
#about .about_in dl dd{width:100%;}
#about .about_in dl dd li{text-indent:-15px;padding:0 0 0 15px;}



#contactform{padding:160px 20px 160px 20px;max-width:800px;margin:0 auto;}
#contactform dl{display:flex;padding:30px 0 0 0;}
#contactform dl dt{width:120px;color:#c69c6d;padding:8px 0 0 0;}
#contactform dl dd{width:100%;}
#contactform dl dd input[type="text"]{border:1px solid #c69c6d;width:100%;padding:12px 10px;color:#c69c6d;}
#contactform dl dd input[type="email"]{border:1px solid #c69c6d;width:100%;padding:12px 10px;color:#c69c6d;}
#contactform dl dd textarea{border:1px solid #c69c6d;width:100%;height:250px;padding:12px 10px;color:#c69c6d;}

#contactform input[type="submit"]{background:#8c6239;color:#fff;display:table;padding:7px 80px;border-radius:5px;margin:50px auto 0 auto;cursor: pointer;}


#contactform .thanks_txt{display:table;margin:0 auto;padding:40px 0 80px 0;font-size:1.8rem;line-height:1.8;}
#contactform .btn2 {max-width:300px;margin:0 auto;}
#contactform .btn2 a{display:block;font-size:2.0;text-align:center;background:#8c6239;padding:15px 10px;border-radius:5px;}


#contactform input[type="button"]{background:#8c6239;color:#fff;display:table;padding:7px 80px;border-radius:5px;margin:10px auto 0 auto;cursor: pointer;}

#contactform .error_messe{color:#f74646;}
#contactform .error_txt{color:#fff;text-align:center;padding:20px 0 50px 0;}
#contactform .conf_txt{color:#fff;text-align:center;padding:20px 0 50px 0;}

#contactform .btnbox{display:flex;justify-content: center;margin:0 auto;padding:40px 0 0 0;}
#contactform .btnbox div{padding:0 10px 0 10px;max-width:220px;width:100%;}

#contactform .btnbox input[type="submit"]{width:100%;background:#8c6239;color:#fff;display:block;padding:7px 10px;border-radius:5px;margin:0 auto;cursor: pointer;}
#contactform .btnbox input[type="button"]{width:100%;background:#aaa;color:#fff;display:block;padding:7px 10px;border-radius:5px;margin:0 auto;cursor: pointer;}

#contactform .formTable {display:table;margin:0 auto;width:100%;}
#contactform .formTable th{border:1px solid #c69c6d;padding:15px 5px;color:#c69c6d;font-weight:normal;width:100px;text-align:center;}
#contactform .formTable td{border:1px solid #c69c6d;padding:15px;color:#c69c6d;word-break: break-word;}


#privacy {padding:160px 20px 0 20px;max-width:950px;margin:0 auto;}
#privacy .privacy_in{padding:40px 0 0 0;}
#privacy .privacy_in h2{padding:50px 0 25px 0;}
#privacy .privacy_in ul{padding:20px 0 0 0;}
#privacy .privacy_in li{padding:5px 0 0 15px;text-indent:-15px;}







.low_wrapper{min-height: calc(100vh - 208px);}


.eachTextAnime span{opacity: 0;}
.eachTextAnime.appeartext span{ animation:text_anime_on 2s ease-out forwards; }
@keyframes text_anime_on {
  0% {opacity:0;}
  100% {opacity:1;}
}
.inv1{opacity:0;}
.inv2{opacity:0;}
.inv3{opacity:0;}
.inv4{opacity:0;}


@media only screen and (max-width:768px){
	html { font-size: 52.5%; }
	body {background:#000 url(../img/common/bg_sp.png) left top no-repeat;background-size:100% 100%;height:auto;}

	footer .f_link{padding:60px 0 0 0;}

	.pcnone{display:block!important;}
	.spnone{display:none!important;}

	.lh1{height:auto!important;}

	#nav-toggle {top: 30px;right: 20px;}

	.kv{margin:100px auto 0 auto;max-width:250px;}
	.kv h1{padding:30px 20px;}

	.tistyle1{padding:40px 0 0 0;}

	#message{max-width:95%;margin:60px 0 0 auto;padding:50px 30px;}
	#message h4{padding:0 0 30px 0;}
	#message .message_box{display:block;padding:0;}
	#message .message_box .message_box_l{margin:0 auto;}
	#message .message_box .message_box_r{padding:20px 0 0 0;}
	#message .message_box .message_box_r h5{text-align:center;}
	#message .message_box .message_box_r p{max-width:500px;margin:0 auto;}

	#design{max-width:95%;margin:60px auto 0 0;padding:50px 30px;}
	#design ul{padding:10px 0 0 0;}
	#design .step_in{flex-wrap: wrap;padding:0;max-width:250px;margin:0 auto;}
	#design .step_in div{width:50%;padding:20px 10px 0 10px;}

	#creative{max-width:95%;margin:60px 0 0 auto;padding:50px 30px;}
	#creative .creative_box{display:block;margin:-30px 0 0 0;}
	#creative .creative_box .creative_box_in{width:100%;padding:30px 0 0 0;max-width:400px;margin:0 auto;}

	#member{max-width:95%;margin:60px auto 0 0;padding:50px 30px;}
	#member .member_box{display:block;margin:-30px 0 0 0;}
	#member .member_box .member_box_in{width:100%;display:block;padding:40px 0 0 0;}
	#member .member_box .member_box_in .member_box_in_l{width:200px;margin:0 auto;}
	#member .member_box .member_box_in .member_box_in_r{width:100%;max-width:400px;margin:0 auto;padding:20px 0 0 0;}
	#member .member_box .member_box_in .member_box_in_r h4{font-size:1.3rem;text-align:center;}

	#contact{max-width:95%;margin:60px 0 0 auto;padding:50px 30px;}
	#contact h4{padding:10px 0 0 0;}
	#contact .btn1 a{margin:20px 0;}

	#about{max-width:95%;margin:60px auto 0 0;padding:50px 30px;}
	#about .about_in{padding:10px 0 0 0;}
	#about .about_in dl{padding:10px 0 0 0;}



	#contactform{padding:100px 20px 100px 20px;}
	#contactform dl{display:block;padding:20px 0 0 0;}
	#contactform dl dt{width:100%;color:#c69c6d;padding:0 0 10px 0;}
	#contactform dl dd textarea{height:200px;}

	#contactform .formTable th{padding:10px 5px;width:70px;}
	#contactform .formTable td{padding:10px 15px;}


	#privacy {padding:100px 20px 0 20px;}
	#privacy .privacy_in{padding:20px 0 0 0;}
	#privacy .privacy_in h2{padding:40px 0 20px 0;}
	#privacy .privacy_in ul{padding:15px 0 0 0;}


}


@media only screen and (max-width:480px){
	body { font-size: 3.5vw; }
	#gloval-nav li a {font-size:6.0vw;}
	footer .f_link{font-size:3.3vw;}


	.kv h1{font-size:10vw;}
	.kv h1 span{font-size:13vw;}

	.tistyle1{font-size:4.2vw;}
	.tistyle2{font-size:3.8vw;}
	.tistyle2 span{font-size:8vw;}


	#message h4{font-size:4.2vw;}
	#message .message_box .message_box_r h5{font-size:3.5vw;}
	#message .message_box .message_box_r h5 span{font-size:4.1vw;}
	#message .message_box .message_box_r p{font-size:3.3vw;}


	#design ul li {font-size: 4vw;}
	#design ul li span{font-size:2.8vw;}

	#design .step p{font-size:4.5vw;}


	#creative .creative_box .creative_box_in h4{font-size:4.5vw;}
	#creative .creative_box .creative_box_in p{font-size:3.3vw;}


	#member .member_box .member_box_in .member_box_in_r h4{font-size:3.3vw;}
	#member .member_box .member_box_in .member_box_in_r h4 span{font-size:4.1vw;}
	#member .member_box .member_box_in .member_box_in_r p{font-size:3.3vw;}

	#contact h4{font-size:4.3vw;}
	#contact .btn1 a{font-size:4.2vw;}

	#about .about_in{font-size:3.3vw;}

	#about .about_in dl dt{width:70px;}


	#contactform .thanks_txt{font-size:3.8vw;}
	#contactform .btn2 a{font-size:4vw;padding:10px;}


}