@charset "utf-8";
/*
Theme Name: L.L.P.SAZAE
Description: さざえ
Version: 1-20181015
Author: anoyoshihisa
*/

html{
	width:100%;
	background-color:#FFF8E9;
	background-image:
	radial-gradient(#fffbf4, rgba(255,255,255,0.2), transparent 200px),
	radial-gradient(#fdfaf4, rgba(255,255,255,0.15), transparent 100px),
	radial-gradient(#fff7e5, rgba(255,255,255,0.1), transparent 200px);
	background-size: 450px 450px, 250px 250px, 150px 150px,50px 150px; 
	background-position: 0 0, 30px 50px, 100px 200px, 55px 80px;
	color:#444444;
}
*{
	margin:0;
	padding:0;
}
a{
	text-decoration: none;
	color:#fff;
}
.sliderbox {
  overflow: hidden;
  z-index: 0;
}
.slider {
  display:none;
}
.slider.slick-initialized {
  display: block;
}
.slider a{
  width: 100%;
  height: 33.6vw;
}
.slider a iframe{
  width: 99.5%;
  height: 100%;
}
.slider .slick-slide a {
    display: block;
    margin: 0 1px;
}
.slick-prev,
.slick-next {
    width: 30px;
    height: 80px;
    z-index: 1;
}

.slick-next {
    right: -webkit-calc(4% + 20px);
    right: calc(4% + 20px);
}
.slick-prev {
    left: -webkit-calc(4% + 20px);
    left: calc(4% + 20px);
}
#hb{
	position: absolute;
	top: 0;
	left: 0;
	background-color:rgba(54,179,139,0.6);
	width:100%;
	height:75px;
	z-index: 1;
}
header{
	position: relative;
}
header,section{
	width:1100px;
	margin-left:auto;
	margin-right:auto;
}
h1 img{
	position: absolute;
	top: 20px;
	left: 10px;
	width: 70px;
}
h2{
	position: absolute;
	font-size: 280%;
	top: 15px;
	left: 70px;
}
h3{
	position: absolute;
	font-size: 90%;
	top: 5px;
	left: 45px;
	color:#ffffff;
}
section{
	text-align: center;
	padding-bottom:10px;
	text-shadow:1px 1px 1px #fff,1px -1px 1px #fff,-1px 1px 1px #fff,-1px -1px 1px #fff;
	z-index: 0;
}
#cinema{
	 width:100%;
}
.clear{
	clear:both;
}
.shadow{
	text-shadow:1px 1px 1px #2b896a,1px -1px 1px #2b896a,-1px 1px 1px #2b896a,-1px -1px 1px #2b896a,1px 0px 1px #2b896a,0px -1px 1px #2b896a,-1px 0px 1px #2b896a,-1px 0px 1px #2b896a;
}
h2,footer p{
	font-family: 'Monoton', cursive;
	font-weight: normal;
	font-style: normal;
	color:#ffffff;
}
.title{
	font-family: 'Secular One', sans-serif;
	font-weight:600;
	font-style: normal;
	color:#36b38b;
	clear:both;
	font-size:2.5em;
}
h5,h6,.sub{
	font-family: 'Sawarabi Gothic', sans-serif;
	font-weight:500;
	font-style: normal;
	font-size: 1.5em;
	color:#36b38b;
}
.small{
	font-weight:400;
	font-size: 75%;
	color:#444;
}
.ue{margin-top:20px;}
h6{
	position: absolute;
	font-size: 1.3em;
	bottom:5px;
	left:0;
	right:0;
	margin:0 auto;
	color:#444;
}
.sub{
	margin:75px auto 10px 10px;
	font-size: 2em;
}
.lefttext{
	font-size:1.75em;
	margin:0 10px;
	text-align: left;	
}
.lt{
	margin-left: 10px;
	text-align: left;	
}
section p{
	margin-top:-15px;
	font-size:140%;
}
.index{
	border: 1px solid #36b38b;
	float:left;
	position: relative;
	width:360px;
	height:230px;
	margin:2px 2px 20px 2px;
	background-position: center center;
}
.index a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent:-999px;
}
.desc{
	margin:1px 0 0 380px;
	font-size:110%;
}
#nav{
	position: absolute; 
	right:0;
	top:10px;
}
#nav a{
    display: none;
}
#nav li{
	position: relative;
   padding: 10px;
	float:left;
	list-style:none;
}
#nav li a{
	font-size:130%;
	color:#fff;
	display: block;
   text-decoration:none;
}
#nav li a:active{
	background-color: #fff !important;
}

#nav li a:hover {
	color:#FF8888;
}
#nav span:after{
	width: 0;
	height: 0;
	border: 0.313em solid transparent; /* 5 */
	border-bottom: none;
	border-top-color:rgba(54,179,139,0.6);
	content: '';
	vertical-align: middle;
	display: inline-block;
	position: relative;
	right: -0.313em; /* 5 */
}
/* first level */
#nav > ul{
	height: 45px;
	float:right;
}
#nav > ul > li{
	height: 100%;
	width:150px;
	float: left;
}
#nav > ul > li > a{
	height: 100%;
	line-height: 2.5em; /* 60 (24) */
	text-align: center;
}
/* second level */
#nav li ul{
	background-color:rgba(54,179,139,0.6);
	display: none;
	position: absolute;
	top: 100%;
}
#nav li:hover ul{
	display: block;
	left: 0;
	right: 0;
}
#nav li:not( :first-child ):hover ul{left: -1px;}
#nav ul li ul li a{font-size:1em;}
footer{
	width:100%;
	height:40px;
	background-color:rgba(54,179,139,0.6);
	text-align: center;	
	font-size: 150%;
}
table.company {
	width: 1000px;
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 0px 15px;
	font-size: 1.5vw;
}
table.company th,table.company td {
	padding: 10px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}

table.company th {
	background: #36b38b;
	vertical-align: middle;
	text-align: left;
	width: 23%;
	overflow: visible;
	position: relative;
	color: #fff;
	font-weight: normal;
	font-size: 2vw;
}

table.company th:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #36b38b;
	border-width: 10px;
	margin-top: -10px;
}
/* firefox */
@-moz-document url-prefix() {
table.company th::after {
	float: right;
	padding: 0;
	left: 30px;
	top: 10px;
	content: " ";
	height: 0;
	width: 0;
	position: relative;
	pointer-events: none;
	border: 10px solid transparent;
	border-left: #36b38b 10px solid;
	margin-top: -10px;
}
}
table.company td {
	background: #f4f4f4;
	width: 360px;
	padding-left: 20px;
}
/*contact7フォーム*/
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="url"],
.wpcf7 input[type="date"],
.wpcf7 input[type="number"],
.wpcf7 textarea {
width: 100%;
padding:10px;
border-radius: 4px;
border: 1px solid rgba(54,179,139,0.6);
font-size:20px;
}
.wpcf7 input[type="date"],
.wpcf7 input[type="number"]{
width:150px;
}
input[type=checkbox] {
	display: none; 	/* チェックボックスを非表示にする */
}
input[type="checkbox"]:checked + .wpcf7-list-item-label {
	background: rgba(54,179,139,0.6);/* マウス選択時の背景色を指定する */
	color: #ffffff; 	/* マウス選択時のフォント色を指定する */
}
.wpcf7-list-item-label:hover {
	background-color: rgba(54,179,139,0.3); 	/* マウスオーバー時の背景色を指定する */ 
}
.wpcf7-list-item-label {
	display: block;		/* ブロックレベル要素化する */ 
	float: left;		/* 要素の左寄せ・回り込を指定する */ 
	margin: 0.5%;		/* ラベル外側の余白を指定する */
	width: 22.8%;		/* ラベルの横幅を指定する */
	height: 120px;		/* ラベルの高さを指定する */
	text-align: center;	/* テキストのセンタリングを指定する */
	line-height: 120px;	/* 行の高さを指定する */
	padding:0 5px;	/*余白を指定する */
	cursor: pointer;		/* マウスカーソルの形（リンクカーソル）を指定する */
	color: #36b38b;			/* フォントの色を指定 */
	border: 1px solid rgba(54,179,139,0.6);/* ラベルの境界線を実線で指定する */
	border-radius: 10px;		/* 角丸を指定する */
	background-color: rgba(255,255,255,0.6); }

/*contact7送信ボタン*/
.wpcf7-submit {
width:200px;
padding:15px;
border-radius:10px;
-webkit-border-radius: 10px;  
-moz-border-radius: 10px;
border: none;
background: rgba(54,179,139,0.6);
transition: 0.3s;
color:#fff;
font-size:20px;
}
.wpcf7-submit:hover {
background: #ddd;
transform: translate3d(0px, 3px, 1px);
-webkit-transform: translate3d(0px, 3px, 1px);
-moz-transform: translate3d(0px, 3px, 1px);
}
form{
width:1000px;
margin:15px auto;
}
form p{
margin:15px 0;
}
@media screen and (max-width: 1099px) {	
section p{font-size:130%;}
.sliderbox {margin-top:75px;}
header,section{
width:918px;
}
.index{width:300px;}
h6{font-size: 100%;}
.desc{margin:1px 0 0 320px;}
table.company {width: 800px;}
form{width:800px;}
.wpcf7-list-item-label {width:22.5%;}
}
@media screen and (max-width: 917px) {	
section p{font-size:120%;}
header{width:100%;}
section{width:640px;}
.slider .slick-slide a {margin: 0;}
.index{width:98%; margin:1%;}
#cinema{width:98%;}
#nav > a{
	width: 3.125em; /* 50 */
	height: 3.125em; /* 50 */
	text-align: left;
	text-indent: -9999px;
	background-color:rgba(54,179,139,0.6);
	position: relative;
	right:10px;
}
#nav > a:before,
#nav > a:after{
	position: absolute;
	border: 2px solid #fff;
	top: 35%;
	left: 25%;
	right: 25%;
	content: '';
}
#nav > a:after{
	top: 60%;
}
#nav:not( :target ) > a:first-of-type,
#nav:target > a:last-of-type{
	display: block;
}
/* first level */
#nav > ul{
	height: auto;
	display: none;
	position: absolute;
	left: -145px;
}
#nav:target > ul{
	display: block;
}
#nav > ul > li{
	background-color:rgba(54,179,139,0.6);
	width: 100%;
	float: none;
}
#nav > ul > li > a{
	height: auto;
	text-align: left;
	padding: 0 20px;
}
#nav > ul > li:not( :last-child ) > a{
	border-right: none;
	border-bottom: 1px solid #36b38b;
}
/* second level */
#nav li ul{
	height: 100px;
	position: static;
	padding:0 20px 20px;
	background-color:rgba(0,0,0,0);
}
#nav li ul a{font-size:250%;}
.desc{margin:1px 5px 0 10px;}
h5{font-size:150%;}
.small{
	display: inline-block;
	font-size:68%;
}
table.company {
width: 640px;
font-size: 2vw;
}
form{width:640px;}
.wpcf7-list-item-label {width:30.3%;}
}
.title{font-size:1.8em;}
@media screen and (max-width: 639px) {
section p{font-size:110%;}
.sliderbox {margin-top:75px;}
header,section{width:100%;}
.slider a{width: 100%; height: 56.4vw;}
.slider a iframe {width: 100%; height: 56.5vw;}
.slick-next {right: 20px;}
.slick-prev {left: 20px;}
#hb{height:75px;}
table.company {
width: 90%;
font-size: 2.5vw;
}
form{width:80%;}
.wpcf7-list-item-label {width:97%;}
}