@charset "utf-8";



/* ==========================================================================
	slider
========================================================================== */
#mt1{
	display:block;
	position:absolute;
	top:24%;
	left:0;
	right:0;
	bottom:0;
	margin:0 auto;
	padding:0 !important;
	z-index:9998 !important;
	width:764px !important;
	height:335px!important;
/*	background:url(../image/main_txt1new.png) top center no-repeat; */
	background:url(../image/main_txt1.png) top center no-repeat;
	background:url(../image/main_txt1_ie.png) top center no-repeat\9;
	background-size:contain !important;
	/*
	top:22%;
	height:296px!important;
	*/
}


#mtbg1{
	display:block;
	position:absolute;
	top:0;
		padding:0 !important;
	z-index:9997 !important;
	width:100% !important;
	height:720px!important;
	background:url(../image/main1.jpg) top center no-repeat;
	background:url(../image/main1_ie.jpg) top center no-repeat\9;
	background-size:cover !important;
	background-size:100% !important\9;
}

#mt2{
/*	display:block;
	position:absolute;
	top:25%;
	left:5.3%;
	padding:0 !important;
	z-index:9998 !important;
	width:618px !important;
	height:148px!important;
	background:url(../image/main_txt2.png) top center no-repeat;
	background:url(../image/main_txt2_ie.png) top center no-repeat\9;
	background-size:contain !important;
	background-size:100% !important\9;
*/

	display:block;
	position:absolute;
	top:24%;
	left:0;
	right:0;
	bottom:0;
	margin:0 auto;
	padding:0 !important;
	z-index:9998 !important;
	width:764px !important;
	height:335px!important;
/*	background:url(../image/main_txt1new.png) top center no-repeat; */
	background:url(../image/main_txt2.png) top center no-repeat;
	background:url(../image/main_txt2_ie.png) top center no-repeat\9;
	background-size:contain !important;


	/*
	
	width:494px !important;
	height:147px!important;
	*/
}


#mtbg2{
	display:block;
	position:absolute;
	top:0;
		padding:0 !important;
	z-index:9997 !important;
	width:100% !important;
	height:720px!important;
	background:url(../image/main2.jpg) top center no-repeat;
	background:url(../image/main2_ie.jpg) top center no-repeat\9;
	background-size:cover !important;
	background-size:100% !important\9;
}


/*
.bx-wrapper:before {
	content:""; 
  position: absolute;
	z-index:9999;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing:border-box;

	border-top: 80px solid transparent;
	border-right: 80px solid transparent;
	border-left: 80px solid transparent;
	border-bottom: 80px solid #fff;
	}
	*/

@media screen and ( max-width: 900px ) {
#mt1{
	display:block;
	position:absolute;
	top:24%;
	left:0;
	right:0;
	bottom:0;
	margin:0 auto;
	padding:0 !important;
	z-index:9998 !important;
	width:93% !important;

	background:url(../image/main_txt1.png) top center no-repeat !important;
	background:url(../image/main_txt1_ie.png) top center no-repeat !important\9;
	background-size:contain !important;
}
	
	}

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

#mtbg1{
	height:340px!important;
	background:url(../image/main1_sp.jpg) top center no-repeat !important;
	background-size:cover !important;
	background-size:100% !important\9;
	}
	
#mt1{
	display:block;
	position:absolute;
	top:18%;
	left:0;
	right:0;
	bottom:0;
	margin:0 auto;
	padding:0 !important;
	z-index:9998 !important;
	width:93% !important;
	max-width:500px;
	background:url(../image/main_txt1.png) top center no-repeat !important; 
/*	background:url(../image/main_txt1new.png) top center no-repeat !important; */
	background-size:contain !important;
}
#mtbg2{
	height:340px!important;
	background:url(../image/main2_sp.jpg) top center no-repeat !important;
	background-size:cover !important;
	background-size:100% !important\9;
	}
	

#mt2{
	display:block;
	position:absolute;
	top:28%;
	left:5.3%;
	padding:0 !important;
	z-index:9998 !important;
	width:75% !important;
	/*
	width:57% !important;
	*/
	background:url(../image/main_txt2.png) top center no-repeat !important;
/*	background:url(../image/main_txt1new.png) top center no-repeat !important; */
	background-size:contain !important;
}
	}

/
@media screen and ( max-width: 500px ) {
#mt1{
	display:block;
	position:absolute;
	top:27%;
	left:0;
	right:0;
	bottom:0;
	margin:0 auto;
	padding:0 !important;
	z-index:9998 !important;
	width:92% !important;
	max-width:500px;
	background:url(../image/main_txt1.png) top center no-repeat !important;
	background:url(../image/main_txt1_ie.png) top center no-repeat !important\9;
	background-size:contain !important;
}
	
	}
	
	


/* ==========================================================================
	TOP LOGO
========================================================================== */

#top_logo{
	position:relative;
	z-index:105;
	width:100%;
/*	background:url(../image/whats_top_bg.jpg) bottom center no-repeat; */
	padding:100px 0 0;
  box-sizing:border-box;
}

#top_logo h1{
/* 	position:absolute;
	width:442px;
	top:-10px;
	left:0;
	right:0;
	margin:0 auto;
*/
	font-size: 41px;
	color: #f68500;
	text-align: center;
	font-weight: 700;

	}

#top_logo h2{
	position:relative;
	width:600px;
	text-align:center;
	font-size:18px;
	font-weight:bold;
	margin:0 auto 40px;
	line-height:18px;
	}


#top_logo div{
	width:100%;
	margin:0 auto;
	max-width:1300px;
	}





	
/* ==========================================================================
	安全
========================================================================== */

#top_whats{
	position:relative;
	z-index:105;
	width:100%;
	background:url(../image/whats_top_bg.jpg) bottom center no-repeat;
	padding:100px 0 0;
  box-sizing:border-box;
}

#whats_arrow{
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 0;
  box-sizing:border-box;
/*  border-top: 80px solid #fff;*/
border-bottom: 100px solid #fff;
}

#top_whats h1{
/* 	position:absolute;
	width:442px;
	top:-10px;
	left:0;
	right:0;
	margin:0 auto;
*/
	font-size: 41px;
	color: #f68500;
	text-align: center;
	font-weight: 700;

	}

#top_whats h2{
	position:relative;
	width:600px;
	text-align:center;
	font-size:18px;
	font-weight:bold;
	margin:0 auto 40px;
	line-height:18px;
	}

#top_whats h3{
	font-size:25px;
	line-height:40px;
	text-align:center;
	font-weight:bold;
	letter-spacing:0;
	color:#424242;
	letter-spacing:-0.025rem;
	}

#top_whats p {
    font-size: 14px;
    font-weight: bold;
    line-height: 30px;
    text-align: center;
    margin: 21px 0 42px;
}

#top_whats div{
	width:100%;
	margin:0 auto;
	max-width:1300px;
	}

@media screen and ( max-width: 720px ) {
	
#top_whats{
	position:relative;
	z-index:105;
	width:100%;
	padding:0;
/*	background:#fcf1f5; */
  box-sizing:border-box;
}


#whats_arrow{
	position: absolute;
	top:-22px;
	border-bottom:22px solid #fcf1f5;
}

#top_whats h1{
/*	position:absolute; */
/*	width:65%; */
	width:100%;
/*	top:4%; */
	left:0;
	right:0;
	margin:0 auto;
	}

#top_whats h1{
	font-size:25px;
	}


#top_whats h2{
	position:relative;
	width:100%;
	box-sliging:border-box;
	text-align:center;
	font-size:17px;
	font-weight:bold;
	padding-top:20%;
	margin:0 auto 6.2%;
	line-height:10px;
	letter-spacing:0.025rem;
	}

#top_whats h2{
	font-size:11px;
	line-height:11px;
	margin:5px 0 19px;
	}

#top_whats h3{
	font-size:16px;
	line-height:24px;
	color:#424242;
	}

#top_whats p{
	font-size:11px;
	font-weight:bold;
	line-height:22px;
	text-align:center;
	margin:18px 0 20px;
	}


#top_whats div{
	width:100%;
	margin:0 auto 22px;
	}
	
	
	}

@media screen and ( max-width: 550px ) {
#whats_arrow{
	position: absolute;
	top:-22px;
	border-bottom:22px solid #fcf1f5;
}
#top_whats h1{
	top:4%;	}
#top_whats h2{
	/*
	font-size:14px;
	*/
	font-size:13px;
	font-weight:bold;
	padding-top:21%;
	margin:0 auto 6.2%;
	line-height:14px;
	}
	}

@media screen and ( max-width: 400px ) {
#top_whats h2{
	font-size:11px;
	font-weight:bold;
	margin:0 auto 6.2%;
	line-height:10px;
	}
	
	}
	
	
	

/* ==========================================================================
	works
========================================================================== */
#top_works {
    width: 100%;
    background: #fff;
}

#top_works{
	position:relative;
	width:100%;
	background:#fff;
	padding:58px 0 0;
	box-sizing:border-box;
	}
/*
#works_bg{
	width:100%;
	height:250px;
	background:url(../image/about_main.jpg) center center no-repeat;
	background-size:cover;
	margin-bottom:50px;
}
*/
	
.works_box{
	width:1000px;
	margin:0 auto 60px;
	position:relative;
	
	}

#top_works h1{
	font-size:41px;
	color:#f68500;
	text-align:center;
	font-weight:700;
	}

#top_works h2{
	font-size:15px;
	line-height:15px;
	text-align:center;
	margin:10px 0 56px;
	font-weight:bold;
	letter-spacing:0.025rem;
	}
	
.works_box .shosai_btn2{
	position:absolute;
	right:0;
	top:15px;
	}
	

.works_box ul{
	width:100%;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	}
.works_box ul::after{
	width:32.4%;
  content:"";
  display: block;	
	}

.works_box ul li{
	width:32.4%;
	margin-bottom:40px;
	}
	

.works_box ul li .works_img{
	width:100%;
	display:block;
	position:relative;
	background-size:cover;
	background-size:cover;
	background-position:top center;
	}
.works_box ul li .works_img:before {
  content:"";
  display: block;
  padding-top:74%;

}
.works_box ul li h3{
	font-size:16px;
	font-weight:bold;
	padding:10px 0 12px;
	color:#424242;
	}

.works_box ul li .day{
	margin-right:18px;
	display:block;
	float:left;
	font-size:12px;
	padding-top:5px;
	font-weight:bold;
	letter-spacing:0;
	}
.works_box ul li .w_cate{
	width:110px;
	padding:3px 0 5px;
	font-size:12px;
	color:#fff;
	font-weight:bold;
	display:block;
	float:left;
	text-align:center;
	}
	
.cate1{
	background:#1285b4;
	}

.cate2{
	background:#b41212;
	}
	
.cate3{
	background:#2d850a;
	}
.cate4{
	background:#ac9e1e;
	}
	
	

@media screen and ( max-width: 1020px ) {
	
.works_box{
	width:100%;
	padding:0 20px;
	box-sizing:border-box;
	}
.works_box .shosai_btn2{
	right:20px;	
	}
}


@media screen and ( max-width: 720px ) {
	
#top_works{
	position:relative;
	width:100%;
	background:#fff;
	padding:10px 0 0 0;
	box-sizing:border-box;
	}
	

#top_works h1{
	font-size:30px;
	}

#top_works h2{
	font-size:11px;
	line-height:11px;
	margin:5px 0 25px;
	}
.works_box .shosai_btn2{
	position:absolute;
	right:0;
	left:0;
	top:100%;
	margin:0 auto;
	}
	
.works_box{
	padding:0 15px;
	margin-bottom:70px;
	}
.works_box ul::after{
	display:none;
	}
.works_box ul li{
/*	width:48%; */
	width:100%;
	margin-bottom:7%;
	}
	
.works_box ul li h3{
	font-size:13px;
	padding:10px 0 8px;
	}

.works_box ul li .day{
	margin-right:10px;
	font-size:10px;
	padding-top:3.5px;
	}
.works_box ul li .w_cate{
	width:80px;
	padding:3px 0 5px;
	font-size:10px;
	color:#fff;
	}

	
.Android .works_box ul li .w_cate{
	padding:5px 0 2px;
	font-size:10px;
	color:#fff;
	}


.iPhone .works_box ul li .w_cate{
	padding:4px 0 3px;
	font-size:10px;
	color:#fff;
	
	}
	}
	
	

/* ==========================================================================
	about
========================================================================== */
#about_bg{
	width:100%;
	height:250px;
	background:url(../image/about_main.jpg) center center no-repeat;
	background-size:cover;
	margin-bottom:50px;
}

#top_about{
	width:100%;
	background:#fff;
}

#top_about h1{
	font-size:41px;
	color:#f68500;
	text-align:center;
	font-weight:700;
	}

#top_about h2{
	font-size:15px;
	line-height:15px;
	text-align:center;
	margin:9px 0 35px;
	font-weight:bold;
	letter-spacing:0.025rem;
	}
#top_about h3{
	font-size:25px;
	line-height:40px;
	text-align:center;
	font-weight:bold;
	letter-spacing:0;
	color:#424242;
	letter-spacing:-0.025rem;
	}
#top_about p{
	font-size:14px;
	font-weight:bold;
	line-height:30px;
	text-align:center;
	margin:21px 0 42px;
	}

#top_about .shosai_btn1{
	margin:0 auto 57px;
	}
	

/*ループスライダーの設定*/

.loopslider {
	margin: 0 auto;
	width: 100%;
	height: 217px;
	text-align: left;
	position: relative;
	overflow: hidden;
}
.loopslider ul {
	width: 100%;
	height: 217px; 
	float: left;
	display: inline;
	overflow: hidden;
}
.loopslider ul li {
	width: 217px;
	height: 217px;
	float: left;
	display: inline;
}

.loopslider ul li img{
	width: 217px;
	height: 217px;
	}
.loopslider .loopslider_wrap{
	height:217px !important;
	}	

/*	ClearFixElements */
.loopslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.loopslider ul {
	display: inline-block;
	overflow: hidden;
}

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

#about_bg{
	width:100%;
	height:170px;
	background:url(../image/about_main_sp.jpg) center center no-repeat;
	background-size:cover;
	margin-bottom:24px;
}
#top_about h1{
	font-size:30px;
	}

#top_about h2{
	font-size:11px;
	line-height:11px;
	margin:5px 0 19px;
	}
	
#top_about h3{
	font-size:16px;
	line-height:24px;
	color:#424242;
	}
#top_about p{
	font-size:11px;
	font-weight:bold;
	line-height:22px;
	text-align:center;
	margin:18px 0 20px;
	}
#top_about .shosai_btn1{
	margin:0 auto 33px;
	}
.loopslider {
	height: 125px;
}
.loopslider ul {
	width: 100%;
	height: 125px;
}
.loopslider ul li {
	width: 125px;
	height: 125px;
}

.loopslider ul li img{
	width: 125px;
	height: 125px;
	}
.loopslider .loopslider_wrap{
	height:125px !important;
	}	

	}

/* ==========================================================================
	news
========================================================================== */
#top_news{
	width:100%;
	padding:45px 0 0;
	background:#f9f8f5;
	}
.news_box{
	width:1000px;
	margin:0 auto;
	position:relative;
	padding-bottom:96px;
}
#top_news h1{
	font-size:41px;
	color:#f68500;
	text-align:center;
	font-weight:700;
	}

#top_news h2{
	font-size:15px;
	line-height:15px;
	text-align:center;
	margin:9px 0 50px;
	font-weight:bold;
	letter-spacing:0.025rem;
	}
	
.news_box .shosai_btn2{
	position:absolute;
	right:0;
	top:15px;
	}


#top_news ul{
	width:100%;
	}
	
#top_news .pc_off{
	display:none;
	}

#top_news ul li{
	border-bottom:1px solid #000;
	}

#top_news ul li:first-child{
	border-top:1px solid #000;
	}
#top_news ul li a{
	padding:15px 0;
	display:block;
	height:60px;
	box-sizing:border-box;
	}
#top_news ul li a:hover{
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
	}
#top_news ul li a span,
#top_news ul li a div,
#top_news ul li a p{
	display:block;
	float:left;
    -moz-transition: opacity 0.4s ease;
    -o-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
	}


#top_news ul li a:hover span,
#top_news ul li a:hover div,
#top_news ul li a:hover p{filter: alpha(opacity=70);
-moz-opacity:0.7;
opacity:0.7;
	}

#top_news ul li a span{
	font-style:italic;
	width:100px;
	padding-top:8px;
	font-size:13px;
	letter-spacing:-0.025rem;
	font-weight:700;
	color:#464452;
	
	}	
#top_news ul li a div{
	width:115px;
	height:30px;
	text-align:center;
	color:#fff;
	padding-top:8px;
	font-size:12px;
	font-weight:bold;
	box-sizing:border-box;
	}

#top_news ul li a p{
	font-size:14px;
	font-weight:bold;
	padding-top:8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	width:760px;
	padding-left:18px;
	box-sizing:border-box;
	color:#424242;
	}
.news_cate1{
	background:#1285b4;
	}
.news_cate2{
	background:#d6791f;
	}
.news_cate3{
	background:#b41212;
	}
.news_cate4{
	background:#2d850a;
	}
.news_cate5{
	background:#ac9e1e;
	}
	
#top_news .bnr_area{
	width:580px; 
	margin:60px auto 0;
	}

#top_news .bnr_area a{
	display:blok;
	width:280px;
	height:210px;
	color:#fff;
	box-sizing:border-box;
	-webkit-transition: opacity 0.4s ease;
    -moz-transition: opacity 0.4s ease;
    -o-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
	}
#top_news .bnr_area a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
	}
	
#top_news .bnr_area .fb_bnr{
	float:left;
	padding:10px 10px 0 10px;
	background:#CC9900;
	position:relative;
	}
	
#top_news .bnr_area .fb_bnr p{
	position:relative;
	font-size:15px;
	font-weight:bold;
}
#top_news .bnr_area .fb_bnr p:before{
	content:"";
	background-size:14px;
/*
	background:url(../image/fb_icon.jpg) 0 0 no-repeat;
	background:url(../image/fb_icon_ie.jpg) 0 0 no-repeat\9;
*/
	background-size:cover;
	-webkit-background-size:14px 24px;   
	position:absolute;
	width:14px;
	height:24px;
	left:-30px;
	top:-5px; 
}
#top_news .bnr_area .insta_bnr{
	float:right;
	padding:10px 10px 0 10px;
	background:#993333;
	position:relative;
	}
	
#top_news .bnr_area .insta_bnr p{
	position:relative;
	font-size:15px;
	font-weight:bold;
}
#top_news .bnr_area .insta_bnr p:before{
	content:"";
	background-size:24px;
/*
	background:url(../image/insta_icon.jpg) 0 0 no-repeat;
	background:url(../image/insta_icon_ie.jpg) 0 0 no-repeat\9;
*/
	background-size:cover;
	-webkit-background-size:24px 23px;   
	position:absolute;
	width:24px;
	height:23px;
	left:-38px;
	top:-3px; 
}
.foot_bnr{
	width:221px;
	height:66px;
	position:absolute;
	border:2px solid #231d1f;
	bottom:-34px;
	left:-38px;
}

@media screen and ( max-width: 1080px ) {
	
.foot_bnr{
	left:10px;
	}

	}
@media screen and ( max-width: 1040px ) {
	
.news_box{
	width:100%;
	box-sizing:border-box;
	padding:0 20px 96px;
}
.news_box .shosai_btn2{
	right:20px;
	}

#top_news ul li a p{
	width:70%;
	
	}

	}
@media screen and ( max-width: 800px ) {
	
#top_news ul li a p{
	width:65%;
	
	}
	
	}
	
	
@media screen and ( max-width: 720px ) {
#top_news{
	padding:29px 0 0;
	}
.news_box{
	width:100%;
	box-sizing:border-box;
	padding:0 15px 68px;
}
#top_news .sp_off{
	display:none !important;
	}
#top_news .pc_off{
	display:block !important;
	}

.news_box .shosai_btn2{
	position:relative;
	margin:8px auto 0;
	right:0;
	}

#top_news h1{
	font-size:30px;
	}

#top_news h2{
	font-size:11px;
	line-height:11px;
	margin:5px 0 25px;
	}
#top_news ul li a{
	padding:8px 0;
	height:auto;}

#top_news ul li a span{
	font-style:italic;
	width:76px;
	padding-top:5px;
	font-size:11px;
}	
#top_news ul li a div{
	width:96px;
	height:20px;
	text-align:center;
	color:#fff;
	padding-top:5px;
	font-weight:bold;
	font-size:10px;
	}
.Android #top_news ul li a div{

	padding-top:7px;
}

#top_news ul li a p{
	width:100%;
	padding:7px 0 0 0;
	font-size:11px;
	float:none;	
	}
	
	
	
#top_news .bnr_area{
	width:100%; 
	margin:35px auto 0;
	}

#top_news .bnr_area a{
	width:100%;
	height:175px;
}

#top_news .bnr_area .fb_bnr{
	float:left;
	width:48%;
	display:block;
	padding:10px 10px 0 10px;
	background:#CC9900;
	position:relative;
	text-align:center;
	}
.Android #top_news .bnr_area .fb_bnr{
	padding-top:15px;
	}
#top_news .bnr_area .fb_bnr p{
	font-size:12px;
	display:block;
	margin:0 auto;
	width:140px;
}
#top_news .bnr_area .fb_bnr p:before{
	content:"";
	background-size:11px;
	-webkit-background-size:11px 19px;   
	position:absolute;
	width:11px;
	height:19px;
	left:-15px;
	top:-3px; 
}
.Android #top_news .bnr_area .fb_bnr p:before{
	left:-5px;
	top:-4px; 
	}
#top_news .bnr_area .insta_bnr{
	float:right;
	width:48%;
	display:block;
	padding:10px 10px 0 10px;
	background:#993333;
	text-align:center;
/*	margin:10px 0; */
	}
	
#top_news .bnr_area .insta_bnr p{
	font-size:12px;
	font-weight:bold;
	display:block;
	margin:0 auto;
	width:140px;
}
#top_news .bnr_area .insta_bnr p:before{
	content:"";
	background-size:19px;
	-webkit-background-size:19px 18px;   
	width:19px;
	height:18px;
	left:-20px;
	top:-2px; 
}
.Android #top_news .bnr_area .insta_bnr p:before{
	left:-8px;
	top:-3px;
	}
.foot_bnr{
	width:130px;
	height:40px;
	position:absolute;
	bottom:28px;
	left:0;
	right:0;
	margin:0 auto;
	border:2px solid #231d1f;
	}

	
}