@charset "utf-8";



.slick-slider * {
	outline: none;
}




#content .meta .type {
	background-size: 20px auto;
}

#content .date {
	display: block;
	font-size: 18px;
	color: #FFF;
	padding-top: 8px;
	padding-bottom: 16px;
}


.icon-distribution {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_distribution.svg);
}
.icon-food {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_food.svg);
}
.icon-maker {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_maker.svg);
}
.icon-educate {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_educate.svg);
}
.icon-financial {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_financial.svg);
}
.icon-it {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_it.svg);
}
.icon-realestate {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_realestate.svg);
}
.icon-service {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_service.svg);
}
.icon-administration {
	background-image: url(/wp-content/themes/safie_casestudy/img/icon_administration.svg);
}

/*common*/

.casestudy_link {
	text-decoration: none;
    font-weight: bold;
    color: #008189;
    border-bottom: 1px solid #008189;
}

figure.aligncenter{
	text-align: center;
}

.conversion {
	clear: both;
	padding-top: 40px;
	padding-bottom: 25px;
}

.conversion_btn {
	display: table;
	background: linear-gradient(to right, #01A1AD,#2479B2);
	border-radius: 2rem;
	padding: 1rem;
	padding-left: 1.5rem;
	margin: 0 auto;
	text-align: center;  
}

.conversion_btn:hover {
	background: linear-gradient(to right, #2479B2,#0a4369);
}

.conversion_btn a {
	font-size: 1rem;
	font-weight: bold;
	color: white;
}

.arrow-right {
	display: inline-block;
	width: 0.6rem;
	height: 0.6rem;
	margin: 0 10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg);
}


.youtube-wrap {
	width: 600px;
	margin: 24px auto;
}

.youtube-inner {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.youtube-wrap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#category-nav-header nav i.top {
	display: none;
}

@media screen and (min-width: 1000px) {


	.slick-dots {
		position: absolute;
		text-align: center;
		font-size: 0;
		width: 100%;
		left: 0;
		bottom: 10px;
		text-align: center;
	}
	.slick-dots li {
		display: inline;
	}
	.slick-dots li + li {
	}
	.slick-dots button {
		position: relative;
		border: none;
		width: 18px;
		height: 18px;
		font-size: 0;
		line-height: 0;
		background: none;
	}
	.slick-dots button:before {
		content: "";
		display: inline-block;
		width: 8px;
		height: 8px;
		background: #fff;
		border-radius: 5px;
	}
	.slick-dots li.slick-active button:before {
		background: #e1cc1d;
	}



	.slick-arrow {
		position: absolute;
		width: 60px;
		height: 60px;
		top: 50%;
		left: 50%;
		z-index: 100;
		margin-top: -30px;
		padding: 0;
		border: none;
		background-color: rgba(255,255,255,0.8);
		background-repeat: no-repeat;
		border-radius: 30px;

		text-align: left;
		text-indent: 1000px;
		white-space: nowrap;
		font-size: 0;

		-ms-transition:     background-color 300ms linear;
		-webkit-transition: background-color 300ms linear;
		-moz-transition:    background-color 300ms linear;
		transition:         background-color 300ms linear;
	}
	.slick-prev {
		margin-left: -600px;
		background-image: url(//safie.link/common/img/arrow_left_green.svg);
		background-size: auto 28px;
		background-position: 45% 50%;
	}
	.slick-next {
		margin-left: 540px;
		background-image: url(//safie.link/common/img/arrow_right_green.svg);
		background-size: auto 28px;
		background-position: 55% 50%;
	}
	.slick-arrow:hover {
		background-color: rgba(255,255,255,1);
	}








	.slides {
		position: relative;
		height: 448px;
		overflow: hidden;
		background: #111;
	}
	.slide {
		position: relative;
		width: 1280px;
		height: 448px;
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}

	.slide article {
		width: 1000px;
		margin: 0 auto;
		padding: 110px 0 0;
	}
	.slide h2 {
		font-size: 30px;
		line-height: 1.3;
		color: #fff;
	}
	.slide h2 strong {
		position: relative;
		display: inline-block;
		font-weight: normal;
		line-height: 1.5;
		padding: 0 0 0 2px;
	}
	/*.slide h2 strong:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 2px;
		left: 0;
		bottom: 0;
		background: #e3c520;
	}*/
	.slide h2 strong span {
		position: relative;
		font-weight: 700;
		border-bottom: 2px solid #e3c520;
	}
	.slide h2 strong + strong {
		padding: 0 2px 0 0;
	}
	.slide h3 {
		margin: 14px 0 0;
		font-size: 30px;
		line-height: 1.3;
		color: #fff;
	}
	.slide a {
		position: relative;
		box-sizing: border-box;
		display: inline-block;
		margin: 30px 0 0;
		width: 280px;
		height: 70px;
		background: #fff;
		border: 6px solid #008088;
		border-radius: 35px;

		color: #008088;
		line-height: 58px;
		font-size: 16px;
		font-weight: 700;
		text-align: center;

		-moz-transition:    all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
		-ms-transition:     all 300ms ease-out;
		transition:         all 300ms ease-out;
	}
	.slide a:after {
		content: "";
		position: absolute;
		display: block;
		width: 16px;
		height: 16px;
		right: 15px;
		top: 50%;
		margin-top: -8px;
		background: url(//safie.link/common/img/arrow_mini.svg) 50% 50% no-repeat;
		background-size: 10px auto;
	}
	.slide a:hover {
		color: #fff;
		background: #008088;
	}
	.slide a:hover:after {
		background-image: url(//safie.link/common/img/arrow_mini_white.svg);
	}



	.slide {
		opacity: 0.5;

		-moz-transition:    all 300ms ease-out 300ms;
		-webkit-transition: all 300ms ease-out 300ms;
		-ms-transition:     all 300ms ease-out 300ms;
		transition:         all 300ms ease-out 300ms;
	}
	.slide article {
		opacity: 0;

		-moz-transition:    all 300ms ease-out 500ms;
		-webkit-transition: all 300ms ease-out 500ms;
		-ms-transition:     all 300ms ease-out 500ms;
		transition:         all 300ms ease-out 500ms;
	}
	.slide.slick-current,
	.slide.slick-current article {
		opacity: 1;
	}






	#content .meta {
		display: inline-block;
		height: 30px;
		overflow: hidden;
		font-size: 0;
		color: #fff;
	}

	#content .meta .type {
		display: inline-block;
		box-sizing: border-box;
		height: 30px;
		padding: 7px 0 9px 14px;
		line-height: 1;
		font-size: 14px;
		font-weight: 700;
		background-color: #008899;
		background-repeat: no-repeat;
		background-position: 5px 50%;
	}
	#content .meta .scale {
		display: inline-block;
		box-sizing: border-box;
		height: 30px;
		padding: 7px 8px 9px 26px;
		line-height: 1;
		font-size: 14px;
		font-weight: 700;
		background: #00937e;
	}
	#content .meta .scale:before {
		position: absolute;
		content: "";
		display: inline-block;
		width: 20px;
		height: 44px;
		top: -0px;
		margin-left: -30px;
		border-right: 1px solid #fff;
		background: #008899;

		-ms-transform:     rotate(-30deg);
		-webkit-transform: rotate(-30deg);
		-moz-transform:    rotate(-30deg);
		transform:         rotate(-30deg);
	}

	#content .meta .icon-construct, #content .meta .icon-medical {
		padding: 7px 0 9px 0px;
	}


	#content .meta em {
		position: relative;
		display: inline-block;
		z-index: 1;
	}
	#content .meta .type em {
		padding-left: 15px;
	}









	.entries {
	}
	.entries ul {
		display : -ms-flexbox; /*for IE10*/
		display : -webkit-flex; /*for old webkit browser*/
		display : flex;
		width: 1026px;
  	flex-wrap: wrap;
  	-ms-flex-wrap: wrap;
  	-webkit-flex-wrap: wrap;
  	margin: auto;
	}
	.entries li {
		width: 315px;
    	margin: 8px;
	}

	.entries li a {
		position: relative;
		display: block;
		height: 650px;
		color: #000;
		background: #fff;
		box-shadow: 5px 5px 6px #bfbfbf;
		-moz-transition:    all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
		-ms-transition:     all 300ms ease-out;
		transition:         all 300ms ease-out;
	}




	.entries li.order-2,
	.entries li.order-3,
	.entries li.order-5,
	.entries li.order-6,
	.entries li.order-8,
	.entries li.order-9,
	.entries li.order-11,
	.entries li.order-12 {
		margin-left: 27px;
	}
	.entries li.order-4,
	.entries li.order-5,
	.entries li.order-6,
	.entries li.order-7,
	.entries li.order-8,
	.entries li.order-9,
	.entries li.order-10,
	.entries li.order-11,
	.entries li.order-12 {
		margin-top: 27px;
	}




	.entries .meta {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 20;
	}

	.entries .thumb {
		position: relative;
		height: 180px;
		overflow: hidden;
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: 100% auto;
		-moz-transition:    all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
		-ms-transition:     all 300ms ease-out;
		transition:         all 300ms ease-out;
	}
	.entries a:hover .thumb:after {
		content: "";
		position: absolute;
		display: block;
		width: 100%;
		height: 340px;
		left: 0;
		top: 0;
		z-index: 10;
		background: url(//safie.link/common/img/grid.png) 0 0 repeat;
	}

	.entries .logo {
		height: 50px;
		margin: 15px 0 0;
		text-align: center;
	}
	.entries .logo img {
		max-height: 40px;
		width: auto;
	}
	.entries .company {
		font-size: 13px;
		font-weight: 700;
		text-align: center;
		color: #8e8e8e;
	}
	.entries .title {
		height: 110px;
		margin: 18px 15px 0;
		font-size: 18px;
		font-weight: 700;
		line-height: 1.6;
		color: #3a3a3a;
		overflow: hidden;
	}
	.entries ul li .abstract {
	    margin: 16px 15px 0;
	    font-size: 14px;
	    line-height: 1.7;
	    height: 140px;
	    overflow: hidden;
	}
	.entries .more {
		display: block;
    	width: 80%;
    	padding: 8px 24px;
    	font-weight: bold;
    	color: #fff;
    	font-size: 14px;
    	background: #00808b;
    	border-radius: 30px;
    	transition: all 0.3s;
    	margin: 24px auto 0;
    	text-align: center;
	}
	.entries .category {
		position: absolute;
		box-sizing: border-box;
		width: 100%;
		height: 30px;
		left: 0;
		bottom: 0;
		padding: 0 10px;
		color: #fff;
		font-size: 14px;
		font-weight: 700;
		line-height: 29px;
		background: #909090;
	}
	.entries li a:hover .more {
		text-decoration: underline;
		color: #3a3a3a;
    	background: #e1cd1d;
	}


	.entries li a:hover {
		color: #000;
		background: #fff;
	}
	.entries li a:hover .thumb:after {
		opacity: 0.5;
	}





	.entries .pager {
		margin: 60px 0 0;
		font-size: 0;
		text-align: center;
	}
	.entries .pager div {
		margin: 0 0 20px;
		font-size: 16px;
		font-family: Montserrat, sans-serif;
	}
	.entries .pager a {
		display: inline-block;
		width: 28px;
		height: 28px;
		font-size: 14px;
		font-family: Montserrat, sans-serif;
		line-height: 28px;
		border: 1px solid #f2f2f2;
		background-color: #f2f2f2;
		border-radius: 0px;
	}
	.entries .pager a + a {
		margin-left: 15px;
	}
	.entries .pager a.active {
		color: #fff;
		border-color: #3a3a3a;
		background-color: #3a3a3a;
	}
	.entries .pager a.disabled {
		color: #bbb;
		border-color: #eee;
		background-color: #eee;
		cursor: default;
	}
	.entries .pager a.hidden {
		display: none;
	}


	.entries .pager .prev,
	.entries .pager .totop,
	.entries .pager .next,
	.entries .pager .toend {
		color: rgba(255,255,255,0);
		background-color: #008088;
		border-color: #008088;
	}




	.entries .pager .prev {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjE3LjQsMTkuOCAxMi42LDE1IDE3LjQsMTAuMiAiLz4NCjwvc3ZnPg0K);
	}
	.entries .pager .next {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjEyLjYsMTAuMiAxNy40LDE1IDEyLjYsMTkuOCAiLz4NCjwvc3ZnPg0K);
	}
	.entries .pager .totop {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjE0LjcsMTkuOCA5LjksMTUgMTQuNywxMC4yIi8+DQo8cG9seWxpbmUgY2xhc3M9InN0MCIgcG9pbnRzPSIyMC4xLDE5LjggMTUuMywxNSAyMC4xLDEwLjIiLz4NCjwvc3ZnPg0K);
	}
	.entries .pager .toend {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjE1LjMsMTAuMiAyMC4xLDE1IDE1LjMsMTkuOCIvPg0KPHBvbHlsaW5lIGNsYXNzPSJzdDAiIHBvaW50cz0iOS45LDEwLjIgMTQuNywxNSA5LjksMTkuOCIvPg0KPC9zdmc+DQo=);
	}






	.recent {
		padding: 40px 0 100px;
		background-color: #e8e8e8;
	}
	.recent h2 {
		margin: 0 0 40px;
		text-align: center;
		font-size: 22px;
		font-weight: 700;
	}








	body.page #content > header {
		position: relative;
		width: 1000px;
		margin: 0 auto;
	}
	body.page #content > header a {
		position: absolute;
		padding-right: 20px;
		top: 20px;
		right: 0;
		color: #008088;
		font-size: 14px;
		font-weight: 700;
		background: url(//safie.link/common/img/icon_back.svg) 100% 50% no-repeat;
		background-size: 16px auto;
	}
	body.page #content > header a:hover {
		opacity: 0.7;
	}

	header .casestudy-headline {
		margin: 40px 0;
		text-align: center;
		font-size: 30px;
		font-weight: 300;
	}

	/*h1 {
		margin: 40px 0;
		text-align: center;
		font-size: 30px;
		font-weight: 300;
	}*/

	header .casestudy-headline, header h2 {
		margin: 40px 0;
		text-align: center;
		font-size: 30px;
		font-weight: 300;
	}

	.page header .casestudy-headline {
		margin: 40px 0;
		text-align: center;
		font-size: 30px;
		font-weight: 300;
	}


	.promo {
		position: relative;
		box-sizing: border-box;
		height: 338px;
		padding: 70px 0 0;
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.promo article {
		width: 1000px;
		margin: 0 auto;
	}
	.promo h2 {
		font-size: 30px;
		line-height: 1.5;
		color: #fff;
	}
	.promo h2 strong {
		position: relative;
		display: inline-block;
		font-weight: normal;
		line-height: 1;
		padding: 0 0 0 2px;
	}
	.promo h2 strong:after {
		/*content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 2px;
		left: 0;
		bottom: 0;
		background: #e3c520;*/
	}
	.promo h2 strong span {
		position: relative;
		display: inline;
		z-index: 10;
		font-weight: 700;
		line-height: 1.4;
		border-bottom: 2px solid #e3c520;
	}
	.promo h2 strong + strong {
		padding: 0 2px 0 0;
	}
	.promo h3 {
		margin: 10px 0 0;
    	font-size: 24px;
    	line-height: 1.3;
    	color: #fff;
	}



	.promo .meta {
		position: relative;
		margin: 15px 0 0;
	}





	.profile {
		padding: 58px 0;
		background: #fff;
	}
	.profile article {
		width: 1000px;
		margin: 0 auto;
	}

	.profile article:after {
		clear: both;
		content: "";
		display: block;
		visibility: hidden;
	}
	.profile figure {
		float: left;
		width: 226px;
		height: 226px;
		border-radius: 113px;
		overflow: hidden;
	}
	.profile figure img {
		width: 100%;
		height: auto;
	}
	.profile dl {
		float: right;
		width: 740px;
	}
	.profile dt {
		margin: 0 0 14px;
	}
	.profile dd h4 {
		margin: 0 0 24px;
		font-size: 20px;
		font-weight: 700;
	}
	.profile dd p {
		font-size: 14px;
    	font-weight: bold;
    	line-height: 1.8;
	}
	.profile dd p a {
		color: #008088;
    	text-align: right;
    	text-decoration: underline;
	}
	.profile dd p a:hover {
		color: #008088;
    	text-align: right;
    	text-decoration: none;
	}


	.detail {
	padding: 40px 0;
    background-color: #f7f7f7;
    }

	.detail h2 {
		margin: 55px 0 24px;
		font-size: 25px;
		font-weight: 700;
		text-align: center;
	}
	.detail h2.subtitle {
		color: #008088;
		font-size: 20px;
	}
	.detail h2 + h2 {
		margin-top: 24px;
	}

	.detail p {
		width: 600px;
    	margin: 24px auto;
    	font-size: 16px;
    	line-height: 2;
    	letter-spacing: -0.2px;
	}
	.detail p.image {
		width: 680px;
		margin: 24px auto;
		font-size: 14px;
		color: #4c4c4c;
	}
	.detail p img {
		display: block;
		margin: 0 auto 10px;
	}

	.detail h2 + p.image {
		margin-top: 36px;
	}

	.detail p em {
		display: block;
		color: #008088;
		font-size: 16px;
		font-weight: 700;
	}
	.detail p.comment {
		color: #888;
		font-style: italic;
	}
	.detail strong {

	}
	.detail span.yellow-marker {
		font-weight: 700;
    	background: #fbea54;
	}




	.column {
		box-sizing: border-box;
		width: 1000px;
		margin: 45px auto;
		padding: 28px;
		border: 11px solid #f2f2f2;
	}
	.column h2 {
		margin: 0 0 25px;
		color: #008088;
		font-size: 24px;
		font-weight: 700;
		text-align: center;
	}
	.column:after {
		clear: both;
		content: "";
		display: block;
		visibility: hidden;
	}
	.column figure {
		float: left;
		width: 270px;
		margin-right: 32px;
	}
	.column figure img {
		width: 100%;
		height: auto;
	}
	.column article {
		font-size: 16px;
		line-height: 1.8;
	}
	.column article.slim {
		float: left;
		width: 620px;
	}
	.column li {
		padding-left: 1.2em;
		text-indent: -1.2em;
	}
	.column li:before {
		content: "・";
		display: inline-block;
		width: 1.2em;
		text-indent: 0;
	}
	.column li + li {
		margin-top: 6px;
	}




	.info {
		position: relative;
    	padding: 40px 0;
    	background: #abded2;
	}
	.info:before {
		position: absolute;
		content: "";
		display: block;
		width: 22px;
		height: 22px;
		left: 50%;
		top: -7px;
		margin: 0 0 0 -11px;
		background: #abded2;

		-ms-transform:     rotate(45deg);
		-webkit-transform: rotate(45deg);
		-moz-transform:    rotate(45deg);
		transform:         rotate(45deg);
	}

	.info h2 {
		margin: 0 0 35px;
		font-size: 22px;
		font-weight: 700;
		text-align: center;
	}
	.info .spec:after {
		clear: both;
		content: "";
		display: block;
		visibility: hidden;
	}
	.info .spec {
		width: 1000px;
		margin: 0 auto 70px;
	}
	.info .spec div {
		box-sizing: border-box;
		float: left;
		width: 499px;
		min-height: 238px;
		padding: 18px 22px;
		color: #fff;
		background: #00937e;
	}

	.info .spec div.budget,
	.info .spec div.purpose {
		background: #008899;
	}

	.info .spec div + div {
		margin-left: 2px;
	}
	.info .spec div + div + div {
		margin-top: 2px;
	}
	.info .spec div:nth-child(3n) {
		margin-left: 0;
	}

	.info .spec h3 {
		padding: 0 0 0 18px;
		line-height: 40px;
		font-size: 25px;
		font-weight: 700;
		border-left: 3px solid #fff;
	}


	.info .spec div.camera p,
	.info .spec div.budget p {
		margin: 35px 0 0;
		font-size: 60px;
		font-weight: 700;
		text-align: center;
	}
	.info .spec div.camera p span,
	.info .spec div.budget p span {
		font-size: 70px;
		font-family: Montserrat, sans-serif;
	}

	.info .spec div.purpose p,
	.info .spec div.reason p {
		margin: 18px 0 0;
		font-size: 16px;
		line-height: 1.8;
	}



	.info .owner {
		box-sizing: border-box;
		width: 1000px;
		margin: 0 auto;
		padding: 36px;
		background: #fff;
	}
	.info .owner:after {
		clear: both;
		content: "";
		display: block;
		visibility: hidden;
	}
	.info figure {
		float: left;
		width: 270px;
		margin-right: 32px;
	}
	.info figure img {
		width: 100%;
		height: auto;
	}
	.info .owner-detail {
	}
	.info .owner-detail.slim {
		float: left;
		width: 620px;
	}


	.info .owner h3 {
		padding: 7px 12px 8px;
		color: #fff;
		line-height: 1;
		font-size: 15px;
		font-weight: bold;
		background: #00937e;
	}
	.info .owner-detail article {
		margin: 12px 0 0;
		font-size: 14px;
		line-height: 1.6;
	}
	.info .owner-detail > div + div {
		margin-top: 20px;
	}
	.info .owner-detail li {
		padding-left: 1.2em;
		text-indent: -1.2em;
		margin-bottom: 10px;
	}
	.info .owner-detail li:before {
		content: "・";
		display: inline-block;
		width: 1.2em;
		text-indent: 0;
	}
	.info .owner-detail li + li {
		margin-top: 3px;
	}
	.info .owner-detail strong.huge {
		font-size: 16px;
    	line-height: 2;
	}
	.info .owner-detail a {
		font-weight: bold;
    	text-decoration: underline;
    	color: #008088;
	}

	.info .owner-detail h4 {
		font-weight: bold;
	}
	.info .owner-detail * + h4 {
		margin-top: 6px;
	}




	#content nav.links {
		text-align: center;
		font-size: 0;
	}
	#content nav.links a {
		position: relative;
		box-sizing: border-box;
		display: inline-block;
		width: 318px;
		height: 83px;
		padding: 0 0 0 72px;
		border-radius: 8px;
		font-size: 20px;
		font-weight: 700;
		line-height: 80px;
		color: #3a3a3a;
		text-align: left;
		overflow: hidden;
	}
	#content nav.links a + a {
		margin-left: 18px;
	}
	#content nav.links a.calc {
		background: #cee4ea;
	}
	#content nav.links a.contact {
		background: #cfe9df;
	}
	#content nav.links a:after {
		position: absolute;
		content: "";
		display: block;
		width: 10px;
		height: 31px;
		right: 8px;
		top: 50%;
		z-index: 10;
		margin: -15px 0 0;
		background: url(//safie.link/common/img/arrow_right_green.svg) 0 0 no-repeat;
	}

	#content nav.links a:before {
		content: "";
		position: absolute;
		display: block;
		z-index: 5;
	}
	#content nav.links a.calc:before {
		width: 54px;
		height: 54px;
		left: 12px;
		top: 50%;
		margin: -27px 0 0;
		background: url(//safie.link/common/img/icon_calc_green.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}
	#content nav.links a.contact:before {
		width: 50px;
		height: 50px;
		left: 13px;
		top: 50%;
		margin: -25px 0 0;
		background: url(//safie.link/common/img/icon_letter_green.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}

	#content nav.links a:hover:after {
		animation-duration: 800ms;
		animation-name: miniarrow;
	}
	#content nav.links strong {
		position: relative;
		z-index: 10;
	}

	#content nav.links a em {
		box-sizing: border-box;
		position: absolute;
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		z-index: 1;

		opacity: 0.25;
		border-radius: 8px;

		-moz-transform:    scale(0);
		-webkit-transform: scale(0);
		-ms-transform:     scale(0);
		transform:         scale(0);

		-moz-transition:    all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
		-ms-transition:     all 300ms ease-out;
		transition:         all 300ms ease-out;
	}
	#content nav.links a.calc em {
		background: #40a7b0;
	}
	#content nav.links a.contact em {
		background: #43b49e;
	}
	#content nav.links a:hover em {
		-moz-transform:    scale(1);
		-webkit-transform: scale(1);
		-ms-transform:     scale(1);
		transform:         scale(1);
	}





	#content nav.social {
		margin: 45px 0 0;
		text-align: center;
		font-size: 0;
	}
	#content nav.social h3 {
		margin: 0 0 24px;
		font-size: 17px;
		font-weight: 700;
		text-align: center;
	}
	#content nav.social a {
		position: relative;
		box-sizing: border-box;
		display: inline-block;
		width: 56px;
		height: 56px;
		border-radius: 28px;
	}
	#content nav.social a + a {
		margin-left: 20px;
	}
	#content nav.social a:before {
		content: "";
		box-sizing: border-box;
		position: absolute;
		display: block;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;

		-moz-transition:    all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
		-ms-transition:     all 300ms ease-out;
		transition:         all 300ms ease-out;
	}

	#content nav.social a.facebook {
		border: 1px solid #164f93;
	}
	#content nav.social a.facebook:before {
		background: url(//safie.link/common/img/icon_facebook_color.svg) 50% 50% no-repeat;
		background-size: 30px auto;
	}
	#content nav.social a.twitter {
		border: 1px solid #0bb3ce;
	}
	#content nav.social a.twitter:before {
		background: url(//safie.link/common/img/icon_twitter_color.svg) 54% 54% no-repeat;
		background-size: 30px auto;
	}
	#content nav.social a:hover:before {
		opacity: 0.6;
	}






	.relation {
		padding: 55px 0;
		background-color: #e8e8e8;
	}
	.relation h2 {
		margin: 0 0 40px;
		font-size: 22px;
		font-weight: 700;
		text-align: center;
	}




	#content .shortcut {
		padding: 30px 0;
		background: #007f86;
	}
	#content .shortcut nav {
		width: 1000px;
		margin: 0 auto;
		font-size: 0;
	}
	#content .shortcut dl {
		color: #fff;
		text-align: center;
		margin: 0 0 25px;
	}
	#content .shortcut dt {
		font-size: 24px;
		font-weight: bold;
	}
	#content .shortcut dd {
		margin: 10px 0 0;
		font-size: 15px;
		font-weight: bold;
	}
	#content .shortcut nav a {
		position: relative;
		display: inline-block;
		width: 488px;
		height: 138px;
		border-radius: 16px;
		overflow: hidden;
	}
	#content .shortcut nav a + a {
		margin-left: 24px;
	}
	#content .shortcut nav a.calc {
		background: #cee4ea;
	}
	#content .shortcut nav a.contact {
		background: #cfe9df;
	}

	#content .shortcut nav a strong {
		position: absolute;
		left: 125px;
		top: 36px;
		z-index: 10;
		font-size: 26px;
		font-weight: 700;
		color: #3a3a3a;
	}
	#content .shortcut nav a span {
		position: absolute;
		left: 125px;
		top: 80px;
		z-index: 10;
		font-size: 16px;
		color: #3a3a3a;
	}

	#content .shortcut nav a:after {
		position: absolute;
		content: "";
		display: block;
		width: 16px;
		height: 50px;
		right: 10px;
		top: 50%;
		z-index: 10;
		margin: -25px 0 0;
		background: url(//safie.link/common/img/arrow_right_green.svg) 0 0 no-repeat;
	}

	#content .shortcut nav a:hover:after {
		animation-duration: 800ms;
		animation-name: miniarrow;
	}



	#content .shortcut nav a:before {
		position: absolute;
		content: "";
		display: block;
		width: 69px;
		height: 69px;
		left: 34px;
		z-index: 5;
		top: 50%;
		margin-top: -33px;
	}
	#content .shortcut nav a.calc:before {
		background: url(//safie.link/common/img/icon_selfcalc.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}
	#content .shortcut nav a.contact:before {
		background: url(//safie.link/common/img/icon_call.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}


	#content .shortcut nav a em {
		box-sizing: border-box;
		position: absolute;
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		z-index: 1;

		opacity: 0.25;
		border-radius: 16px;

		-moz-transform:    scale(0);
		-webkit-transform: scale(0);
		-ms-transform:     scale(0);
		transform:         scale(0);

		-moz-transition:    all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
		-ms-transition:     all 300ms ease-out;
		transition:         all 300ms ease-out;
	}
	#content .shortcut nav a.calc em {
		background: #40a7b0;
	}
	#content .shortcut nav a.contact em {
		background: #43b49e;
	}
	#content .shortcut nav a:hover em {
		-moz-transform:    scale(1);
		-webkit-transform: scale(1);
		-ms-transform:     scale(1);
		transform:         scale(1);
	}






	#category-nav {
		padding: 0 0 60px;
	}
	#category-nav h2 {
		position: relative;
		height: 38px;
		line-height: 38px;
		margin: 0 0 60px;
		text-align: center;
		font-size: 16px;
		color: #fff;
		background: #3a3a3a;
	}
	#category-nav h2:before {
		position: absolute;
		content: "";
		display: block;
		width: 10px;
		height: 10px;
		left: 50%;
		bottom: -5px;
		margin: 0 0 0 -5px;
		background: #3a3a3a;

		-ms-transform:     rotate(45deg);
		-webkit-transform: rotate(45deg);
		-moz-transform:    rotate(45deg);
		transform:         rotate(45deg);
	}


	#category-nav .categories {
		width: 1000px;
		margin: 0 auto;
	}
	#category-nav .categories + .categories {
		margin-top: 25px;
	}

	#category-nav .category-title {
		margin: 0 0 20px;
		font-size: 22px;
		font-weight: 700;
	}
	#category-nav ul {
		font-size: 0;
	}
	#category-nav li {
		display: inline-block;
		margin: 0 0 20px;
		font-size: 16px;
		line-height: 1;
	}
	#category-nav li:after {
		position: relative;
		display: inline-block;
		top: -3px;
		margin: 0 25px;
		content: "/";
		font-size: 12px;
		font-weight: 700;
		color: #008088;
	}
	#category-nav li:last-child:after {
		display: none;
	}


	#category-nav li em {
		display: inline-block;
		width: 24px;
		height: 24px;
		margin: 0 8px 0 0;
		vertical-align: -5px;
	}





	.category-header {
	}
	.category-header div {
		position: relative;
		height: 38px;
		line-height: 38px;
		text-align: center;
		font-size: 16px;
		color: #fff;
		background: #008088;
	}
	.category-header div:before {
		position: absolute;
		content: "";
		display: block;
		width: 10px;
		height: 10px;
		left: 50%;
		bottom: -5px;
		margin: 0 0 0 -5px;
		background: #008088;

		-ms-transform:     rotate(45deg);
		-webkit-transform: rotate(45deg);
		-moz-transform:    rotate(45deg);
		transform:         rotate(45deg);
	}


	.entries.category {
		margin: 25px 0 100px;
	}
	.entries.category h2 {
		margin: 0 0 40px;
		text-align: center;
		font-size: 26px;
		font-weight: 700;
	}
	.entries.category h2 em {
		display: inline-block;
		width: 40px;
		height: 40px;
		margin: 0 5px 0 0;
		vertical-align: -4px;
	}


	.entries.category .pickup {
		width: 999px;
		margin: 0 auto 27px;
		position: relative;
	}



	.entries .pickup .thumb {
		height: 338px;
		overflow: hidden;
	}
	.entries .pickup .thumb:after {
		height: 338px;
	}

	.entries .pickup .logo {
		position: absolute;
		width: 340px;
		height: 50px;
		left: 0;
		top: 30px;
		margin: 338px 0 0;
	}
	.entries .pickup .company {
		position: absolute;
		width: 340px;
		height: 30px;
		top: 80px;
		margin: 338px 0 0;
	}
	.entries .pickup .title {
		width: 610px;
		height: auto;
		margin: 30px 0 10px 350px;
	}
	.entries .pickup .abstract {
	    width: 610px;
	    margin: 0 0 0 350px;
	}
	.entries .pickup .more {
	    position: relative;
    	margin: 20px auto 80px;
	}
	.entries .pickup .category {
		width: 315px;
		height: 30px;
	    left: auto;
    	top: 308px;
	}




	#category-nav-header {
	}
	#category-nav-header nav {
		position: relative;
		height: 75px;
		text-align: center;
		font-size: 0;
		background: #008088;
	}
	#category-nav-header nav li {
		position: relative;
		display: inline-block;
		width: 190px;
	}
	#category-nav-header nav li a {
		display: block;
		height: 75px;
		line-height: 75px;
		color: #fff;
		font-size: 16px;
		font-weight: 700;
		cursor: pointer;
	}
	#category-nav-header nav li a em {
		position: absolute;
		display: block;
		width: 190px;
		height: 75px;
		left: 0;
		top: 0;
		z-index: 1;
		border: 0 solid #56abaf;
		border-width: 0 1px;
		-ms-transform: skew(30deg, 0);
		-webkit-transform: skew(30deg, 0);
		-moz-transform: skew(30deg, 0);
		transform: skew(30deg, 0);
	}
	#category-nav-header nav li a span {
		position: relative;
		z-index: 10;
	}
	#category-nav-header nav li:hover a em,
	#category-nav-header nav li.active a em {
		background: #369aa0;
	}
	#category-nav-header nav li + li a em {
		border-left: none;
	}
	#category-nav-header nav li + li:hover a em,
	#category-nav-header nav li + li.active a em {
		border-left: 1px solid #56abaf;
	}
	#category-nav-header nav i {
		position: absolute;
		width: 20px;
		height: 20px;
		left: 50%;
		bottom: 0;
		z-index: 10;
		margin: 0 0 0 -10px;
		overflow: hidden;

		-ms-transition: all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
		-moz-transition: all 300ms ease-out;
		transition: all 300ms ease-out;
	}
	#category-nav-header nav i:before {
		content: "";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		left: 50%;
		top: 16px;
		margin: 0 0 0 -5px;
		background: #e0c401;
		-ms-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	#category-nav-header.category nav i {
		margin-left: -280px;
	}

	#category-nav-header.scale nav i {
		margin-left: -85px;
	}

	#category-nav-header.problem nav i {
		margin-left: 100px;
	}

	#category-nav-header.camera nav i {
		margin-left: 290px;
	}

	#category-nav-header .categories {
		border-top: 3px solid #e1c501;
		background: #f2f2f2;
	}
	#category-nav-header .categories ul {
		width: 940px;
		margin: 0 auto;
		padding: 24px 0;
	}
	#category-nav-header .categories ul:after {
		clear: both;
		content: "";
		display: block;
		visibility: hidden;
	}
	#category-nav-header .categories li {
		float: left;
		width: 180px;
	}
	#category-nav-header .categories li + li {
		margin-left: 10px;
	}
	#category-nav-header .categories li + li + li + li + li + li {
		margin-top: 10px;
	}
	#category-nav-header .categories li:nth-child(5n + 1) {
		margin-left: 0;
	}
	#category-nav-header .categories li a {
		position: relative;
		box-sizing: border-box;
		display: block;
		height: 40px;
		line-height: 38px;
		border: 1px solid #d3d3d3;
		border-radius: 6px;
		font-size: 14px;
		text-align: center;
		cursor: pointer;
	}
	#category-nav-header .categories li.active a {
		color: #008088;
		background: #fff;
	}
	#category-nav-header .categories li a em {
		position: absolute;
		display: block;
		width: 24px;
		height: 24px;
		left: 8px;
		top: 50%;
		margin-top: -12px;
		font-size: 0;
		line-height: 0;
	}
	#category-nav-header .categories li.all a em {
		width: 22px;
		height: 22px;
		left: 10px;
		margin-top: -10px;
	}



	.no-entry {
		margin: 80px 0 0;
		padding: 260px 0 0;
		background: url(//safie.link/common/img/symbol.svg) 50% 0 no-repeat;
		background-size: 220px auto;
	}
	.no-entry p {
		line-height: 1.6;
		font-size: 20px;
		font-weight: bold;
		text-align: center;
	}

	.conversion {
		padding-top: 30px;
		padding-bottom: 10px;

	}
	
}










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

	.slick-dots {
		position: absolute;
		text-align: center;
		font-size: 0;
		width: 100%;
		left: 0;
		bottom: 5px;
		text-align: center;
	}
	.slick-dots li {
		display: inline;
	}
	.slick-dots li + li {
	}
	.slick-dots button {
		position: relative;
		border: none;
		width: 18px;
		height: 18px;
		font-size: 0;
		line-height: 0;
		background: none;
	}
	.slick-dots button:before {
		content: "";
		display: inline-block;
		width: 8px;
		height: 8px;
		background: #fff;
		border-radius: 5px;
	}
	.slick-dots li.slick-active button:before {
		background: #e1cc1d;
	}

	.slick-arrow {
		display: none !important;
	}





	.slides {
		position: relative;
		height: 224px;
		overflow: hidden;
	}
	.slide {
		position: relative;
		width: 100vw;
		height: 224px;
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.slide article {
		padding: 30px 15px 0;
	}
	.slide h2 {
		font-size: 16px;
		line-height: 1.3;
		color: #fff;
	}
	.slide h2 strong {
		position: relative;
		display: inline-block;
		font-weight: normal;
		line-height: 1;
		padding: 0 0 0 2px;
	}
	/*.slide h2 strong:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 2px;
		left: 0;
		bottom: 0;
		background: #e3c520;
	}*/
	.slide h2 strong span {
		position: relative;
		font-weight: 700;
		line-height: 1.8;
		border-bottom: 2px solid #e3c520;
	}
	.slide h2 strong + strong {
		padding: 0 2px 0 0;
	}
	.slide h3 {
		margin: 8px 0 0;
		font-size: 14px;
		line-height: 1.3;
		color: #fff;
	}
	.slide a {
		position: relative;
		display: block;
		width: 160px;
		height: 36px;
		margin: 15px 0 0;
		line-height: 32px;
		font-size: 13px;
		font-weight: 700;
		text-align: center;
		color: #008088;
		border: 3px solid #008088;
		background: #fff;
		border-radius: 30px;
	}
	.slide a:after {
		content: "";
		position: absolute;
		display: none;
		width: 16px;
		height: 16px;
		right: 5px;
		top: 50%;
		margin-top: -8px;
		background: url(//safie.link/common/img/arrow_mini.svg) 50% 50% no-repeat;
		background-size: 8px auto;
	}







	#content .meta {
		display: inline-block;
		height: 26px;
		overflow: hidden;
		font-size: 0;
		color: #fff;
	}

	#content .meta .type {
		display: inline-block;
		box-sizing: border-box;
		height: 26px;
		padding: 6px 0 6px 12px;
		line-height: 1;
		font-size: 13px;
		font-weight: 700;
		background-color: #008899;
		background-repeat: no-repeat;
		background-position: 5px 50%;
	}
	#content .meta .scale {
		display: inline-block;
		box-sizing: border-box;
		height: 26px;
		padding: 6px 6px 6px 20px;
		line-height: 1;
		font-size: 13px;
		font-weight: 700;
		background: #00937e;
	}
	#content .meta .scale:before {
		position: absolute;
		content: "";
		display: inline-block;
		width: 20px;
		height: 44px;
		top: -0px;
		margin-left: -26px;
		border-right: 1px solid #fff;
		background: #008899;

		-ms-transform:     rotate(-30deg);
		-webkit-transform: rotate(-30deg);
		-moz-transform:    rotate(-30deg);
		transform:         rotate(-30deg);
	}

	#content .meta em {
		position: relative;
		display: inline-block;
		z-index: 1;
	}
	#content .meta .type em {
		padding-left: 15px;
	}

	#content .meta .icon-construct, #content .meta .icon-medical {
		padding: 6px 0 6px 0px;
	}


	.entries {
	}
	.entries ul {
		margin: 0 15px;
	}
	.entries ul:after {
	}
	.entries li {
		position: relative;
		background: #fff;
		box-shadow: 5px 5px 6px #bfbfbf;
	}
	.entries li {
		padding-bottom: 40px;
	}

	.entries li a {
		display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
		height: 100%;
		color: #000;
	}



	.entries li {
		margin-bottom: 15px;
	}


	.entries .meta {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 20;
	}

	.entries .thumb {
		position: relative;
		height: 250px;
		overflow: hidden;
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	/*.entries .thumb:after {
		content: "";
		position: absolute;
		display: block;
		width: 100%;
		height: 140px;
		left: 0;
		top: 0;
		z-index: 10;
		background: url(//safie.link/common/img/grid.png) 0 0 repeat;
	}*/

	.entries .logo {
		height: 48px;
		margin: 8px 0 0;
		text-align: center;
	}
	.entries .logo img {
		max-height: 40px;
		width: auto;
	}
	.entries .company {
		font-size: 13px;
		font-weight: 700;
		text-align: center;
		color: #8e8e8e;
	}
	.entries .title {
		margin: 10px 20px 0;
    	font-size: 16px;
    	font-weight: 700;
    	line-height: 1.6;
    	color: #3a3a3a;
	}
	.entries .abstract {
		margin: 16px 20px 24px;
    	font-size: 14px;
    	line-height: 1.8;
	}
	.entries .more {
		display: block;
    	width: 80%;
    	padding: 8px 24px;
    	font-weight: bold;
    	color: #fff;
    	font-size: 14px;
    	background: #00808b;
    	border-radius: 30px;
    	transition: all 0.3s;
    	margin: auto auto 0;
    	text-align: center;
	}
	.entries .category {
		position: absolute;
		box-sizing: border-box;
		width: 100%;
		height: 26px;
		left: 0;
		bottom: 0;
		padding: 0 10px;
		color: #fff;
		font-size: 13px;
		font-weight: 700;
		line-height: 25px;
		background: #909090;
	}





	.entries .pager {
		position: relative;
		height: 50px;
		margin: 40px 0 0;
		font-size: 0;
		text-align: center;
		background: #eee;
	}
	.entries .pager div {
		line-height: 50px;
		font-size: 15px;
		font-family: Montserrat, sans-serif;
	}
	.entries .pager a {
		display: none;
	}
	.entries .pager a.totop,
	.entries .pager a.prev,
	.entries .pager a.next,
	.entries .pager a.toend {
		position: absolute;
		display: block;
		width: 40px;
		height: 50px;
		top: 0;
		font-size: 14px;
		font-family: Montserrat, sans-serif;
		line-height: 50px;
		color: rgba(255,255,255,0);
		background-position: 50% 50%;
	}
	.entries .pager a.totop {
		left: 0;
	}
	.entries .pager a.prev {
		left: 40px;
	}
	.entries .pager a.next {
		right: 40px;
	}
	.entries .pager a.toend {
		right: 0;
	}
	.entries .pager a.disabled {
		opacity: 0.3;
	}




	.entries .pager .prev {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojMDA4MDg4O3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjE3LjQsMTkuOCAxMi42LDE1IDE3LjQsMTAuMiAiLz4NCjwvc3ZnPg0K);
	}
	.entries .pager .next {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojMDA4MDg4O3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjEyLjYsMTAuMiAxNy40LDE1IDEyLjYsMTkuOCAiLz4NCjwvc3ZnPg0K);
	}
	.entries .pager .totop {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojMDA4MDg4O3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjE0LjcsMTkuOCA5LjksMTUgMTQuNywxMC4yIi8+DQo8cG9seWxpbmUgY2xhc3M9InN0MCIgcG9pbnRzPSIyMC4xLDE5LjggMTUuMywxNSAyMC4xLDEwLjIiLz4NCjwvc3ZnPg0K);
	}
	.entries .pager .toend {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwIDMwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMCAzMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCi5zdDB7ZmlsbDpub25lO3N0cm9rZTojMDA4MDg4O3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQ0KPC9zdHlsZT4NCjxwb2x5bGluZSBjbGFzcz0ic3QwIiBwb2ludHM9IjE1LjMsMTAuMiAyMC4xLDE1IDE1LjMsMTkuOCIvPg0KPHBvbHlsaW5lIGNsYXNzPSJzdDAiIHBvaW50cz0iOS45LDEwLjIgMTQuNywxNSA5LjksMTkuOCIvPg0KPC9zdmc+DQo=);
	}







	.recent {
		padding: 20px 0 50px;
		background-color: #e8e8e8;
	}
	.recent h2 {
		margin: 0 0 20px;
		text-align: center;
		font-size: 16px;
		font-weight: 700;
	}





	body.page #content > header {
		position: relative;
	}
	body.page #content > header a {
		position: absolute;
		width: 30px;
		height: 30px;
		top: 2px;
		right: 15px;
		font-size: 0;
		background: url(//safie.link/common/img/icon_back.svg) 100% 50% no-repeat;
		background-size: 16px auto;
	}

	header .casestudy-headline {
		margin: 15px 0;
		text-align: center;
		font-size: 22px;
		font-weight: 300;
	}

	.page header h2 {
		margin: 15px 0;
		text-align: center;
		font-size: 22px;
		font-weight: 300;
	}


	.promo {
		position: relative;
		box-sizing: border-box;
		min-height: 200px;
		padding: 30px 0 0;
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.promo article {
		margin: 0 15px;
	}
	.promo h2 {
		font-size: 16px;
		line-height: 1.5;
		color: #fff;
	}
	.promo h2 strong {
		position: relative;
		display: block;
		font-weight: normal;
		padding: 0 0 0 2px;
	}
	.promo h2 strong:after {
		/*content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 2px;
		left: 0;
		bottom: 0;
		background: #e3c520;*/
	}
	.promo h2 strong span {
		position: relative;
		display: inline;
		z-index: 10;
		font-weight: 700;
		line-height: 1.8;
		border-bottom: 2px solid #e3c520;
	}
	.promo h2 strong + strong {
		padding: 0 2px 0 0;
	}
	.promo h3 {
		margin: 8px 0 0;
		font-size: 14px;
		line-height: 1.3;
		color: #fff;
	}

	.promo .meta {
		position: relative;
		margin: 15px 0 0;
	}





	.profile {
		padding: 20px 0;
		background: #fff;
	}
	.profile article {
		margin: 0 15px;
	}

	.profile article:after {
		clear: both;
		content: "";
		display: block;
		visibility: hidden;
	}
	.profile figure {
		float: left;
		width: 90px;
		height: 90px;
		border-radius: 45px;
		overflow: hidden;
	}
	.profile figure img {
		width: 100%;
		height: auto;
	}
	.profile dl {
	}
	.profile dt {
		padding-left: 105px;
	}
	.profile dt img {
		width: auto;
    	max-width: 200px;
	}
	.profile dd {
		max-width: 100%;
    	padding-left: 12px;
	}
	.profile dd h4 {
    	margin: 10px 0 0;
    	font-size: 16px;
    	font-weight: 700;
    	padding-left: 94px;
	}
	.profile dd p {
		clear: both;
		padding: 15px 0 0;
		font-size: 13px;
		font-weight: bold;
		line-height: 1.8;
	}
	.profile dd p a {
		color: #008088;
    	text-align: right;
    	text-decoration: underline;
	}


	.detail {
	padding: 20px 0;
    background-color: #f7f7f7;
    }

	.detail h2 {
		margin: 25px 15px 12px;
		font-size: 18px;
		font-weight: 700;
		text-align: center;
	}
	.detail h2.subtitle {
		font-size: 18px;
    	color: #008088;
    	line-height: 1.8;
	}
	.detail h2.subtitle:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 2px;
		left: 0;
		bottom: 0;
		background: #e3c520;
	}
	.detail h2 + h2 {
		margin-top: 12px;
	}
	.detail p {
		box-sizing: border-box;
		width: 100%;
		margin: 15px 0;
		padding: 0 15px;
		font-size: 14px;
		line-height: 2;
		letter-spacing: -0.3px;
	}
	.detail p.image {
		font-size: 12px;
		color: #4c4c4c;
	}
	.detail p img {
		display: block;
		max-width: 100%;
		height: auto;
		margin: 0 auto 10px;
	}

	.detail p em {
		display: block;
		color: #008088;
		font-size: 14px;
		font-weight: 700;
	}
	.detail p.comment {
		color: #888;
		font-style: italic;
	}
	.detail span.yellow-marker {
    	font-weight: 700;
    	background: #fbea54;
	}



	.column {
		box-sizing: border-box;
		margin: 30px 15px;
		padding: 15px;
		border: 5px solid #f2f2f2;
	}
	.column h2 {
		margin: 0 0 12px;
		color: #008088;
		font-size: 18px;
		font-weight: 700;
		text-align: center;
	}
	.column figure {
		margin: 0 0 20px;
    	text-align: center;
	}
	.column figure img {
		height: auto;
	}
	.column article {
		margin: 10px 0 0;
		font-size: 13px;
		line-height: 1.6;
	}
	.column li {
		padding-left: 1.2em;
		text-indent: -1.2em;
	}
	.column li:before {
		content: "・";
		display: inline-block;
		width: 1.2em;
		text-indent: 0;
	}
	.column li + li {
		margin-top: 6px;
	}



	.info {
		position: relative;
		padding: 20px 0;
    	background: #abded2;
	}
	.info:before {
		position: absolute;
		content: "";
		display: block;
		width: 22px;
		height: 22px;
		left: 50%;
		top: -7px;
		margin: 0 0 0 -11px;
		background: #aadfd2;

		-webkit-transform: rotate(45deg);
		transform:         rotate(45deg);
	}

	.info h2 {
		margin: 0 0 20px;
		font-size: 16px;
		font-weight: 700;
		text-align: center;
	}

	.info .spec {
		margin: 0 15px 35px;
	}
	.info .spec div {
		box-sizing: border-box;
		min-height: 80px;
		padding: 10px 12px;
		color: #fff;
		background: #00937e;
	}

	.info .spec div.budget,
	.info .spec div.reason {
		background: #008899;
	}

	.info .spec div + div {
		margin-top: 2px;
	}

	.info .spec h3 {
		padding: 0 0 0 10px;
		line-height: 25px;
		font-size: 18px;
		font-weight: 700;
		border-left: 3px solid #fff;
	}


	.info .spec div.camera p,
	.info .spec div.budget p {
		margin: 5px 0 0;
		font-size: 34px;
		font-weight: 700;
		text-align: center;
	}
	.info .spec div.camera p span,
	.info .spec div.budget p span {
		font-size: 40px;
		font-family: Montserrat, sans-serif;
	}

	.info .spec div.purpose p,
	.info .spec div.reason p {
		margin: 10px 0 0;
		font-size: 13px;
		line-height: 1.6;
	}





	.info .owner {
		box-sizing: border-box;
		margin: 20px 15px;
		padding: 15px;
		background: #fff;
	}
	.info figure {
		margin: 0 0 20px;
    	text-align: center;
	}
	.info figure img {
		height: auto;
	}
	.info .owner-detail {
	}


	.info .owner h3 {
		padding: 5px 10px 6px;
		color: #fff;
		line-height: 1;
		font-size: 14px;
		font-weight: bold;
		background: #00937e;
	}
	.info .owner-detail article {
		margin: 8px 0 0;
		font-size: 13px;
		line-height: 1.5;
	}
	.info .owner-detail > div + div {
		margin-top: 15px;
	}
	.info .owner-detail li {
		padding-left: 1.2em;
		text-indent: -1.2em;
	}
	.info .owner-detail li:before {
		content: "・";
		display: inline-block;
		width: 1.2em;
		text-indent: 0;
	}
	.info .owner-detail li + li {
		margin-top: 2px;
	}
	.info .owner-detail strong.huge {
		font-size: 14px;
		line-height: 2;
	}
	.info .owner-detail h4 {
		font-weight: bold;
	}
	.info .owner-detail * + h4 {
		margin-top: 5px;
	}



	#content nav.links {
		text-align: center;
		font-size: 0;
	}
	#content nav.links a {
		position: relative;
		box-sizing: border-box;
		display: block;
		height: 60px;
		margin: 0 15px;
		padding: 0 0 0 60px;
		border-radius: 8px;
		font-size: 16px;
		font-weight: 700;
		line-height: 60px;
		color: #3a3a3a;
		text-align: left;
		overflow: hidden;
	}
	#content nav.links a + a {
		margin-top: 10px;
	}
	#content nav.links a.calc {
		background: #cee4ea;
	}
	#content nav.links a.contact {
		background: #cfe9df;
	}
	#content nav.links a:after {
		position: absolute;
		content: "";
		display: block;
		width: 8px;
		height: 25px;
		right: 8px;
		top: 50%;
		z-index: 10;
		margin: -12.5px 0 0;
		background: url(//safie.link/common/img/arrow_right_green.svg) 0 0 no-repeat;
	}

	#content nav.links a:before {
		content: "";
		position: absolute;
		display: block;
		z-index: 5;
	}
	#content nav.links a.calc:before {
		width: 40px;
		height: 40px;
		left: 11px;
		top: 50%;
		margin: -20px 0 0;
		background: url(//safie.link/common/img/icon_calc_green.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}
	#content nav.links a.contact:before {
		width: 36px;
		height: 36px;
		left: 14px;
		top: 50%;
		margin: -18px 0 0;
		background: url(//safie.link/common/img/icon_letter_green.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}


	#content nav.links strong {
		position: relative;
		z-index: 10;
	}





	#content nav.social {
		margin: 30px 0 0;
		text-align: center;
		font-size: 0;
	}
	#content nav.social h3 {
		margin: 0 0 12px;
		font-size: 16px;
		font-weight: 700;
		text-align: center;
	}
	#content nav.social a {
		box-sizing: border-box;
		display: inline-block;
		width: 50px;
		height: 50px;
		border-radius: 25px;
	}
	#content nav.social a + a {
		margin-left: 20px;
	}
	#content nav.social a.facebook {
		border: 1px solid #164f93;
		background: url(//safie.link/common/img/icon_facebook_color.svg) 50% 50% no-repeat;
		background-size: 25px auto;
	}
	#content nav.social a.twitter {
		border: 1px solid #0bb3ce;
		background: url(//safie.link/common/img/icon_twitter_color.svg) 54% 54% no-repeat;
		background-size: 25px auto;
	}






	.relation {
		padding: 25px 0;
		background-color: #e8e8e8;
	}
	.relation h2 {
		margin: 0 0 25px;
		font-size: 16px;
		font-weight: 700;
		text-align: center;
	}





	#content .shortcut {
		padding: 15px 0;
		background: #007f86;
	}
	#content .shortcut dl {
		margin: 0 15px 15px;
		color: #fff;
	}
	#content .shortcut dt {
		font-size: 15px;
		font-weight: bold;
	}
	#content .shortcut dd {
		margin: 8px 0 0;
		font-size: 12px;
		font-weight: bold;
	}
	#content .shortcut nav {
		margin: 0 15px;
		font-size: 0;
	}
	#content .shortcut nav a {
		position: relative;
		display: block;
		height: 80px;
		border-radius: 16px;
		overflow: hidden;
	}
	#content .shortcut nav a + a {
		margin-top: 15px;
	}
	#content .shortcut nav a.calc {
		background: #cee4ea;
	}
	#content .shortcut nav a.contact {
		background: #cfe9df;
	}

	#content .shortcut nav a strong {
		position: absolute;
		left: 56px;
		top: 18px;
		z-index: 10;
		font-size: 18px;
		font-weight: 700;
		color: #3a3a3a;
	}
	#content .shortcut nav a span {
		position: absolute;
		left: 56px;
		top: 45px;
		z-index: 10;
		font-size: 12px;
		color: #3a3a3a;
	}

	#content .shortcut nav a:after {
		position: absolute;
		content: "";
		display: block;
		width: 10px;
		height: 31px;
		right: 8px;
		top: 50%;
		z-index: 10;
		margin: -15px 0 0;
		background: url(//safie.link/common/img/arrow_right_green.svg) 0 0 no-repeat;
	}




	#content .shortcut nav a:before {
		position: absolute;
		content: "";
		display: block;
		width: 40px;
		height: 40px;
		left: 12px;
		z-index: 5;
		top: 50%;
		margin-top: -20px;
	}
	#content .shortcut nav a.calc:before {
		background: url(//safie.link/common/img/icon_selfcalc.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}
	#content .shortcut nav a.contact:before {
		background: url(//safie.link/common/img/icon_call.svg) 50% 50% no-repeat;
		background-size: 100% auto;
	}

	#content .date {
		font-size: 13px;
	}







	#category-nav {
		padding: 0 0 40px;
	}
	#category-nav h2 {
		position: relative;
		height: 32px;
		line-height: 32px;
		margin: 0 0 20px;
		text-align: center;
		font-size: 14px;
		color: #fff;
		background: #3a3a3a;
	}
	#category-nav h2:before {
		position: absolute;
		content: "";
		display: block;
		width: 10px;
		height: 10px;
		left: 50%;
		bottom: -5px;
		margin: 0 0 0 -5px;
		background: #3a3a3a;

		-ms-transform:     rotate(45deg);
		-webkit-transform: rotate(45deg);
		-moz-transform:    rotate(45deg);
		transform:         rotate(45deg);
	}


	#category-nav .categories {
		margin: 0 15px;
	}
	#category-nav .categories + .categories {
		margin-top: 20px;
	}

	#category-nav .category-title {
		margin: 0 0 10px;
		font-size: 14px;
		font-weight: 700;
	}
	#category-nav ul {
		font-size: 0;
	}
	#category-nav li {
		display: inline-block;
		margin: 0 0 12px;
		font-size: 14px;
		line-height: 1;
	}
	#category-nav li:after {
		position: relative;
		display: inline-block;
		top: -3px;
		margin: 0 15px;
		content: "/";
		font-size: 12px;
		font-weight: 700;
		color: #008088;
	}
	#category-nav li:last-child:after {
		display: none;
	}


	#category-nav li em {
		display: inline-block;
		width: 16px;
		height: 16px;
		margin: 0 6px 0 0;
		vertical-align: -3px;
	}





	.category-header {
	}
	.category-header div {
		position: relative;
		height: 38px;
		line-height: 38px;
		text-align: center;
		font-size: 16px;
		color: #fff;
		background: #008088;
	}
	.category-header div:before {
		position: absolute;
		content: "";
		display: block;
		width: 10px;
		height: 10px;
		left: 50%;
		bottom: -5px;
		margin: 0 0 0 -5px;
		background: #008088;

		transform:         rotate(45deg);
	}


	.entries.category {
		margin: 25px 0 100px;
	}
	.entries.category h2 {
		margin: 0 0 40px;
		text-align: center;
		font-size: 26px;
		font-weight: 700;
	}
	.entries.category h2 em {
		display: inline-block;
		width: 40px;
		height: 40px;
		margin: 0 5px 0 0;
		vertical-align: -4px;
	}


	.entries.category .pickup {
		width: 100%;
		margin: 0 auto 60px;
		position: relative;
	}



	.entries .pickup .thumb {
		height: 208px;
		overflow: hidden;
	}
	.entries .pickup .thumb:after {
		height: 338px;
	}

	.entries .pickup .logo {
		position: relative;


		left: 0;
		margin: 20px 0 0;
	}
	.entries .pickup .company {
		position: relative;
		top: 0;
		margin: 0;
	}
	.entries .pickup .title {
		width: 100%;
		height: auto;
		padding: 0 14px;
		margin: 30px 0 10px 0;
	}
	.entries .pickup .abstract {
		width: 100%;
		padding: 0 14px;
		margin: 0;
	}
	.entries .pickup .more {
		position: relative;
		width: 80%;
		bottom: 0;
		margin: 20px auto;
	}
	.entries .pickup .category {
		width: 315px;
		height: 30px;
		left: auto;
		right: 0;
		top: 178px;
	}




	#category-nav-header {
		margin: 0;
	}
	#category-nav-header nav {
		position: relative;
		height: 40px;
		text-align: center;
		font-size: 0;
		background: #008088;
	}
	#category-nav-header nav li {
		position: relative;
		display: inline-block;
		width: 106px;
	}
	#category-nav-header nav li a {
		display: block;
		height: 40px;
		line-height: 40px;
		color: #fff;
		font-size: 11px;
		font-weight: 700;
	}
	#category-nav-header nav li a em {
		position: absolute;
		display: block;
		width: 106px;
		height: 40px;
		left: 0;
		top: 0;
		z-index: 1;
		border: 0 solid #56abaf;
		border-width: 0 1px;
		/*
		transform: skew(15deg, 0);
		*/
	}
	#category-nav-header nav li + li {
		width: 107px;
	}
	#category-nav-header nav li + li a em {
		width: 107px;
	}


	#category-nav-header nav li a span {
		position: relative;
		z-index: 10;
	}
	#category-nav-header nav li.active a em {
		background: #369aa0;
	}
	#category-nav-header nav li + li a em {
		border-left: none;
	}
	#category-nav-header nav li + li.active a em {
		border-left: 1px solid #56abaf;
	}
	#category-nav-header nav i {
		position: absolute;
		width: 20px;
		height: 20px;
		left: 50%;
		bottom: 0;
		z-index: 10;
		margin: 0 0 0 -10px;
		overflow: hidden;

		transition: all 300ms ease-out;
	}
	#category-nav-header nav i:before {
		content: "";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		left: 50%;
		top: 16px;
		margin: 0 0 0 -5px;
		background: #e0c401;
		transform: rotate(45deg);
	}

	#category-nav-header.category nav i {
		margin-left: -170px;
	}
	#category-nav-header.scale nav i {
		margin-left: -65px;
	}

	#category-nav-header.problem nav i {
		margin-left: 45px;
	}

	#category-nav-header.camera nav i {
		margin-left: 150px;
	}

	#category-nav-header .categories {
		width: 100vw;
		border-top: 3px solid #e1c501;
		background: #f2f2f2;
		overflow-x: scroll;
		-webkit-overflow-scrolling : touch;
	}
	#category-nav-header .categories ul {
		width: auto;
		margin: 0 auto;
		padding: 10px;
		white-space: nowrap;
	}
	#category-nav-header .categories ul:after {
		clear: both;
		content: "";
		display: block;
		visibility: hidden;
	}
	#category-nav-header .categories li {
		display: inline-block;
		width: 120px;
		text-align: left;
	}
	#category-nav-header .categories li {
		margin-right: 8px;
	}
	#category-nav-header .categories li a {
		position: relative;
		box-sizing: border-box;
		display: block;
		height: 32px;
		line-height: 30px;
		padding-left: 36px;
		border: 1px solid #d3d3d3;
		border-radius: 6px;
		font-size: 11px;
		text-align: left;
	}
	#category-nav-header .categories li.active a {
		color: #008088;
		background: #fff;
	}
	#category-nav-header .categories li a em {
		position: absolute;
		display: block;
		width: 20px;
		height: 20px;
		left: 8px;
		top: 50%;
		margin-top: -10px;
		font-size: 0;
		line-height: 0;
	}
	#category-nav-header .categories li.all a em {
		width: 18px;
		height: 18px;
		left: 9px;
		margin-top: -9px;
	}

	#category-nav-header .problem li a,
	#category-nav-header .camera li a {
		padding-left: 0px;
		text-align: center;
	}

	#category-nav-header .problem li.all a {
		padding-left: 36px;
		text-align: left;
	}

	#category-nav-header li.w155 {
		width: 155px;
	}

	.no-entry {
		margin: 40px 0 40px;
		padding: 150px 0 0;
		background: url(//safie.link/common/img/symbol.svg) 50% 0 no-repeat;
		background-size: 120px auto;
	}
	.no-entry p {
		line-height: 1.4;
		font-size: 14px;
		font-weight: bold;
		text-align: center;
	}

	.youtube-wrap {
		width: 90%;
		max-width: 600px;
		margin: 15px auto;
	}
}

@media screen and (max-width: 501px) {
	#category-nav-header .categories {
		border: none;
	}

	#category-nav-header nav {
		height: 83px;
		overflow: hidden;
	}

	#category-nav-header nav li {
		width: 50%;
		border-bottom: 3px solid #e1c501;
	}

	#category-nav-header nav li + li {
		width: 50%;
	}

	#category-nav-header nav ul li a em {
		width: 100%;
		border: none;
	}
	
	#category-nav-header nav li:nth-child(odd) a em {
		border-right: 1px solid #56abaf;
	}

	#category-nav-header nav i {
		margin-left: -10px !important;
	}

	#category-nav-header nav i.top {
		display: block;
	}

	#category-nav-header.category nav i.top {
		margin-bottom: 43px;
		left: 25%;
	}

	#category-nav-header.category nav i {
		left: -125%;
	}

	#category-nav-header.scale nav i.top {
		margin-bottom: 43px;
		left: 75%;
	}

	#category-nav-header.scale nav i {
		left: -125%;
	}

	#category-nav-header.problem nav i.top {
		margin-bottom: 43px;
		left: 125%;
	}

	#category-nav-header.problem nav i {
		left: 25%;
	}

	#category-nav-header.camera nav i.top {
		margin-bottom: 43px;
		left: 125%;
	}

	#category-nav-header.camera nav i {
		left: 75%;
	}

	#content .date {
		font-size: 13px;
	}
}

@media screen and (max-width: 1000px) and (min-width: 501px) {

	.entries ul:after {
		content: "";
		clear: both;
		display: block;
		visibility: hidden;
	}
	.entries ul {
    	display : -ms-flexbox; /*for IE10*/
		display : -webkit-flex; /*for old webkit browser*/
		display : flex;

    	flex-wrap: wrap;
    	-ms-flex-wrap: wrap;
    	-webkit-flex-wrap: wrap;

    	margin: 0 15px;
	}
	.entries li {
		width: calc(50% - 10px);
		margin: 0px 5px 15px 5px;
	}

	.entries .abstract {
		min-height: 7em;
	}


	.entries li.order-2,
	.entries li.order-4,
	.entries li.order-6,
	.entries li.order-8,
	.entries li.order-10,
	.entries li.order-12 {
		margin-left: 10px;
		float: right;
	}
	.detail p {
    box-sizing: border-box;
    width: 60%;
    margin: 15px auto;
    padding: 0;
    font-size: 15px;
    line-height: 2;
}

}

/* パンくず */
div.breadcrumbs {
	max-width: 1000px;
	margin: 20px auto;
	padding: 0px 40px;
	font-size: 14px;
	white-space: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	-ms-overflow-style: none;    /* IE, Edge 対応 */
	scrollbar-width: none;       /* Firefox 対応 */
}

div.breadcrumbs::-webkit-scrollbar {  /* Chrome, Safari 対応 */
	display:none;
}

@media screen and (max-width: 750px) {
	div.breadcrumbs {
    padding: 0px 20px;
	}
}

@media screen and (min-width: 1280px) {
	div.breadcrumbs {
			padding: 0px;
	}
}