@charset "UTF-8";

/************************************************************
RESET & DEFAULT
************************************************************/

/***************************RESET & DEFAULT*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video,
input, button, textarea, select {
  margin: 0;
  padding: 0;
  color: #000000;
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  font-weight: normal;
  font-size: 100%;
  text-decoration: none;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

img	{
  border-width: 0;
  border-style: none;
  vertical-align: bottom;
}

a,
a i{
	color:#003b82;
	text-decoration:none;
}

a:hover,
a:hover i{
	color:#003b82;
	text-decoration:underline;
}

a:visited,
a:visited i{
	color:#003b82;
}

a:active,
a:active i{
	color:#003b82;
}

.pc{
	display:block;
}

.sp{
	display:none;
}

/*-----------------------width 768 or less*/

@media screen and (max-width: 768px){

.pc{
	display:none;
}

.sp{
	display:block;
}

}


/************************************************************
TOOL
************************************************************/

.center{
	text-align:center;
}

.mt50{
	margin-top:50px;
}

.mt30{
	margin-top:30px;
}

.mt20{
	margin-top:20px;
}

.mb50{
	margin-bottom:50px;
}

.mb30{
	margin-bottom:30px;
}

.m{
	font-size:14px;
	line-height:1.6;
}

h2 {
	margin: 50px auto 30px;
	width: 960px;
	line-height:1;
	font-weight:bold;
	font-family: "Helvetica Neue", Arial, "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-size: 24px;
	color: ;
}

h3 {
	margin: 50px auto 30px;
	width:960px;
	font-size:16px;
	line-height:1.6;
	font-weight:bold;
}

.column2 {
	display: flex;
    justify-content: space-between;
    margin: 0 auto 50px;
    width: 960px;
}
.column2_L {
	width: 470px;
}
.column2_R {
	width: 470px;
}

.column2_R p.youtube img{
	width:250px;
	margin:0 0 5px;
}

/*-----------------------width 768 or less*/

@media screen and (max-width: 768px){

.mt50{
	margin-top:8vw;
}

.mt30{
	margin-top:3.9vw;
}

.mt20{
	margin-top:2.6vw;
}

.mb50{
	margin-bottom:8vw;
}

.mb30{
	margin-bottom:3.9vw;
}

.m{
	font-size:3.2vw;
}

h2 {
  margin: 40px auto 20px;
	width:94.6vw;
}

h3 {
	margin: 40px auto 20px;
	width:94.6vw;
	font-size:4.27vw;
}

.column2 {
	display: block;
    width: 94.6vw;
}
.column2_L {
	width: 100%;
	margin-bottom: 20px;
}
.column2_R {
	width: 100%;
}


}


/************************************************************
HEADER
************************************************************/

header{
	position:fixed;
	top:0;
	left:50%;
	transform:translateX(-50%);
	z-index:111;
	margin:0 auto 0 auto;
	width:960px;
	height:80px;
	border-bottom-width:1px;
	border-bottom-style:solid;
	border-bottom-color:#000000;
	background-color:#fff;
}

header .log_paradise{
	position:absolute;
	top:40px;
	left:0;
	width:225px;
	height:auto;
}

header nav .lst_g-navi{
	position:absolute;
	top:41px;
	left:280px;
	list-style:none;
	font-size:0;
	line-height:0;
}

header nav .lst_g-navi li{
	display:inline-block;
    margin: 0 20px 0 0;
    width: 80px;
}

header nav .lst_g-navi li a{
	display:block;
	padding:5px;
	width:100%;
	height:100%;
	color:#000000;
	border-radius:5px;
	font-size:14px;
	font-weight:bold;
	line-height:1;
	text-align:center;
}

header nav .lst_g-navi li a:hover{
	background-color:#e5e5e5;
	text-decoration-line:none;
}

header .btn_hdr_facebook{
	display:block;
	position:absolute;
	top:38px;
	right:43px;
	/* right:0; */
}

header .btn_hdr_facebook img{
	width:29px;
	height:29px;
}

header .btn_hdr_instagram{
	display:block;
	/* display:none; */
	position:absolute;
	top:38px;
	right:0px;
}

header .btn_hdr_instagram img{
	width:29px;
	height:29px;
}


/*-----------------------width 768 or less*/

@media screen and (max-width: 768px){

header{
	width:94.6vw;
	height:20vw;
}

header .log_paradise{
	top:3.9vw;
	width:50vw;
}

header nav .lst_g-navi{
	top:14.5vw;
	left: 50%;
	transform: translate(-50%, 0);
	width: max-content;
}

header nav .lst_g-navi li{
	margin:0 0 0 0;
	width: auto;
}

header nav .lst_g-navi li a{
	border-radius:0.65vw;
	font-size:2.4vw;
}

header .btn_hdr_facebook{
	top:3.5vw;
	right:11.5235vw;
	/* right:0; */
}

header .btn_hdr_facebook img{
	width:7vw;
	height:7vw;
}

header .btn_hdr_instagram{
	top:3.5vw;
}

header .btn_hdr_instagram img{
	width:7.5vw;
	height:7.5vw;
}

}

/*-----------------------width 425 or less*/

@media screen and (max-width: 425px){

  header nav .lst_g-navi li a{
  	border-radius:0.65vw;
  	font-size:3.2vw;
  }

}


/************************************************************
FOOTER
************************************************************/

footer{
	position:relative;
	margin:80px auto 0 auto;
	padding:20px 0 30px 0;
	width:960px;
	border-top-width:1px;
	border-top-style:solid;
	border-top-color:#000000;
	font-size:12px;
	line-height:1;
	text-align:center;
}

#btn_pagetop{
	position:fixed;
	bottom:67px;
	right:0px;
 	width:89px;
	height:auto;
	opacity:0.5;
}

/*-----------------------width 768 or less*/

@media screen and (max-width: 768px){

footer{
	padding:3vw 0 4vw 0;
	width:94.6vw;
	font-size:2.6667vw;
}

#btn_pagetop{
	position:fixed;
	bottom:11vw;
	right:0px;
 	width:15vw;
	height:auto;
	opacity:0.5;
}

}

#message{
	margin:-80px 0 0;
	padding:80px 0 0;
}
#news{
	margin:-80px 0 0;
	padding:80px 0 0;
}
#works{
	margin:-80px 0 0;
	padding:80px 0 0;
}
#profile{
	margin:-80px 0 0;
	padding:80px 0 0;
}
#contact{
	min-height:1000px;
	margin:-80px 0 0;
	padding:80px 0 0;
}

#contact h2{
	margin:50px auto 80px;
}

@media screen and (max-width: 768px){
	#message{
		margin:-20vw 0 0;
		padding:20vw 0 0;
	}
	#news{
		margin:-20vw 0 0;
		padding:20vw 0 0;
	}
	#works{
		margin:-20vw 0 0;
		padding:20vw 0 0;
	}
	#profile{
		margin:-20vw 0 0;
		padding:20vw 0 0;
	}
	#contact{
		margin:-20vw 0 0;
		padding:20vw 0 0;
	}
}