@charset "UTF-8";

@font-face {
  font-family: 'Noto Sans JP Thin';
  src: url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.woff2) format('woff2'),
       url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.woff) format('woff'),
       url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.otf) format('opentype');
}

@font-face {
  font-family: 'Noto Sans JP Light';
  src: url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff2) format('woff2'),
       url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff) format('woff'),
       url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.otf) format('opentype');
}

@font-face {
   font-family: 'Noto Sans JP Black';
   font-style: normal;
   font-weight: 900;
   src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Black.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Black.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Black.otf) format('opentype');
 }

html, body {
	height: 100%;
}

.wrapper {
	width: 100%;
	height: 100%;
	position: relative;
	background: #FFF;
}

.border-box {
	width: 95%;
	height: 95%;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	box-sizing: border-box;
	border-style: solid;
	border-color: #212121;
}

.border-round {
	border-width: 7px;
}

.content-box {
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	text-align: center;
}

#lang-fb-box {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 200px;
}

#lang-fb-box ul {
	text-align: right;
}

#lang-fb-box ul li {
	display: inline-block;
	margin-left: 20px;
	vertical-align: middle;
}

#lang-fb-box ul li a {
	font-family: "Noto Sans JP Black";
	text-decoration: none;
}

#lang-on {
	padding: 0px 10px;
	border: 2px solid #212121;
}

#logo {
	text-align: center;
	position: absolute;
	top: -100px;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 600px;
	height: 45px;
}

#nav-news-box {
	position: absolute;
	bottom: 40px;
	left: 0;
	right: 0;
	margin: auto;
    width: 700px;
}

#nav-list {
	margin-bottom: 30px;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

#nav-list li {
    margin: 0 25px;
    text-align: center;
}

#nav-list li:last-child {
}

#nav-list li a {
	font-family: "Noto Sans JP Thin";
	color: #333;
	font-size: 26px;
	text-decoration: none;
}

#nav-list li a:hover {
	text-decoration: underline;
}

#news-list {
	width: 500px;
	margin: 0 auto;
	font-family: "Noto Sans JP Light";
}

#news-list li {
	text-align: left;
	font-size: 13px;
	margin-bottom: 5px;
}

#portfolio_list li{
	width:220px;
	height:220px;
	float:left;
	padding-right:15px;
	display:table;
	margin-bottom:15px;
	position: relative;
}

.portfolio_badge{
	position: absolute;
	top: 5px;
	right: 20px;
}

.portfolio_box{
	width:220px;
	height:220px;
	background-color:#fff;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	position:relative;
}

.portfolio_box .exit_box{
	width:0;
	height:0;
	position:absolute;
	top:-30px;
	left:-30px;
	border-top: 35px solid transparent;
	border-right: 35px solid transparent;
	border-bottom: 35px solid #b3b3b3;
	border-left: 35px solid transparent;
	transform: rotate(-45deg);
}

.portfolio_box .exit_box p{
	color: #fff;
    font-family: roboto;
    font-size: 15px;
    font-weight: bold;
    margin-left: -21px;
    padding-top: 11px;
    text-align: center;
    width: 3em;
}

/*------------map------------*/

#adress{
	margin-bottom:4%;
}

/*------------about------------*/

#about table tbody tr th{
	width:160px;
	padding:15px 20px;
	background:#d7d8d9;
	border-bottom:5px solid #f5f5f5;
}

#about table tbody tr td{
	padding:15px 20px;
	background-color:#fff;
	border-bottom:5px solid #f5f5f5;
	border-left:5px solid #f5f5f5;
}

#about table{
	margin-bottom:100px;
	width:100%;
}

.mb30{
	margin-bottom:30px;
}

.lp_list{
	display:table;
	margin-bottom:70px;
}

.lp_list li{
	display:table-cell;
	vertical-align:middle;
	padding-right:40px;
}

#camp_list{
	margin-top:20px;
	margin-left:1em;
}

#camp_list li{
	line-height:1.5;
	margin-bottom:10px;
	font-size:12px;
}

#camp_list li:before{
	content:"・";
	margin-left:-1em;
}

/*-----news----------------*/
#news_list{
	width:1200px;
	margin:0 auto;
	padding:60px 0 35px 0;
}

#news_list li{
	padding-bottom:15px;
	color:#eee;
}

.news_date{
	width:150px;
	float:left;
}

.news_body{
	width:1000px;
	float:left;
}

.clear{
	clear:both;
}

.news_box{
	width:100%;
	background-color:#32373b;
}

#news_list li p a{
	color:#eee;
}

#news_list li p a:hover{
	color:#00ace5;
}

#facebook_btn{
	float:right;
	width:40px;
}

.top_logo{
	width: 550px;
	margin: 0 auto;
	padding: 180px 0;
}

#logo img {
    width: 600px;
}

#news-list li {
    display: flex;
}

.news-list-date {
    padding-right:1em;
}

@media screen and (max-width: 1200px) {
    #wrap_contents {
        width: 95%;
    }
}

@media screen and (max-width: 800px) {
    #logo {
    	width: 80%;
    }

    #logo img {
        width: 100%;
    }

    #news-list {
        width: 90%;
    }

    #news-list li:nth-child(3), #news-list li:nth-child(4), #news-list li:nth-child(5) {
        display: none;
    }

    #nav-news-box {
        width: 90%;
    }

    #nav-news-box li {
        margin: 0;
        width: 50%;
    }
}