@charset "utf-8";

/* ++++++++++++++++++++++++++++++++++++++++

	Top Page for Smart Devices

++++++++++++++++++++++++++++++++++++++++ */

@media (max-width: 767px) {

header nav {
	position: fixed;
	z-index: 1;
}
header nav li {
	height: auto;
}
header nav>ul>li>a {
	background-image: none;
}
	
#container {
    padding-top: 23%;
}
	
#navBtn {
    top: 50%;
}

.pc_only {
	display: none;
}
	
.sp_only {
	display: block;
}

/* ----------------------------------------
	mvSlider
---------------------------------------- */

#mv {
	position: relative;
	z-index: 1;
	padding: 0 3.125% 6.25%;
}

#mvSliderWrap {
	width: 100%;
	height: auto;
	padding-top: 33.33%;
}

#mvSlider {
	position: absolute;
	top: 0;
	width: 100%;
}

#mvSliderWrap .sliderFrameL,
#mvSliderWrap .sliderFrameR {
	top: -1%;
	height: 102%;
}


/* ----------------------------------------
	mvSlider3
---------------------------------------- */

/*#mvSlider3Wrap {
	width: 100%;
	height: auto;
	padding-top: 100%;
}

#mvSlider3 {
	position: absolute;
	top: 0;
	width: 100%;
	margin: 0 auto;
}

#mvSlider3Wrap .sliderFrameL,
#mvSlider3Wrap .sliderFrameR {
	top: -1%;
	height: 102%;
}
*/

#mvSlider3 {
    width: 100%;
    height: auto;
    padding-top: 2.25%;
    margin: 0 auto;
}

#mvSlider3 li{
	width: 100%;
	display:inline-block;
}
#mvSlider3 li img{
	width: 100%;
}

/* ----------------------------------------
	nav
---------------------------------------- */
nav {
	padding-top: 19.5%;
}


#indexNav {
	display: block;
	overflow: visible;
	position: static;
	height: auto;
	/*margin-bottom: 6.25%;*/
	padding: 3.125%;
	background: #e9e9e9;
}
#indexNav ul {
	background: none;
}
#indexNav li {
	float: left;
	width: 33.33%;
	height: auto;
	margin-top: 1.33%;
	border: 0;
}/*
#indexNav li:nth-child(odd) {
	float: right;
}*/
#indexNav li:nth-child(2),
#indexNav li:nth-child(3),
#indexNav li:nth-child(4) {
	margin-top: 0;
}

#indexNav li.library,
#indexNav li.attention, 
#indexNav li.event{
	float: left;
	margin-top: 1.33%;
	width: 100%;
}

#indexNav li a {
	top: 0;
	width: 100%;
	padding-top: 100%;
}

#indexNav .project>a { background-image: url(../img/sp/index/nav_project.png); }
#indexNav .employee>a { background-image: url(../img/sp/index/nav_employee.png); }
#indexNav .company>a { background-image: url(../img/sp/index/nav_company.png); }
#indexNav .library>a { 
	background-image: url(../img/sp/index/nav_library.png);
    background-size: contain;
    padding-top: 25%;
}
#indexNav .event>a { 
	background-image: url(../img/sp/index/nav_event.png);
    background-size: contain;
    padding-top: 25%;
}


#indexNav .photo,
#indexNav .sub,
#indexNav li ul,
#indexNav li .close,
#indexNav #navClose {
	display: none;
}

/* navModal
---------------------------------------- */

#navModal,
#navModal>a,
#navModal>div {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 10000;
	width: 100%;
	height: 100%;
}
#navModal {
	overflow-x: hidden;
}
#navModal>a {
	background: rgba(0,0,0,.7);
}
#navModal>div {
	display: table;
	position: relative;
	width: 87.5%;
	height: 100%;
	margin: auto;
}

#navModalContents {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	font-size: 14px;
}
#navModalContents ul {
	padding: 10px 10px 0;
	background: #fff;
}
#navModalContents a {
	display: block;
	padding: 10px;
	border-bottom: solid 1px #c9c9c9;
	color: #000;
}

#navModalContents .close {
	display: block;
	padding: 20px 10px;
	border: 0;
	background: #fff;
}


/* ----------------------------------------
	mailmagazine&sitecaution
---------------------------------------- */

#indexNav li#sitecaution_sp {
	float: left;
	margin-top: 1.33%;
	width: 100%;
}
#indexNav li#sitecaution_sp a {
    background-image:url(../img/index/bnr_sitecaution.png);
    background-size: contain;
    padding-top: 15%;
    background-repeat: no-repeat;
}
	
#indexNav li#mailmagazine_sp {
	float: left;
	margin-top: 1.33%;
	width: 100%;
}	
#indexNav li#mailmagazine_sp a {
    background-image:url(../img/index/bnr_mailmagazine.png);
    background-size: contain;
    padding-top: 15%;
    background-repeat: no-repeat;
}

	
/* ---------------------------------------
	article
---------------------------------------- */

article {
	position: relative;
	z-index: 1;
	float: none;
	width: auto;
}
article>div>div {
	width: auto;
	height: auto;
}

/* insta
---------------------------------------- */

#insta {
	margin-bottom: 25px;
	padding: 4.6875% 3.125% 6.25%;
	background: url(../img/photo/bg.png) repeat;
}

#insta .more2 {
	background: #1da1f2;
	width: 100%;
	font-size: x-large;
	font-weight: bold;
	padding: 0;
	margin-top: 20px;
	border: none;
	text-align: center;
}

#insta .more2 a {
	color: #fff;
	text-decoration: none;
	padding: 10px 0;
	width: 100%;
	display: block;
}

#insta .more {
	display: none !important;
}


/* news
---------------------------------------- */

#news {
	height: auto;
	border-top: solid 3px #f00;
}
#news h2 {
	position: static;
	float: none;
	width: auto;
	height: auto;
	margin: 0;
	padding: 1.625% 3.125% 3%;
	background: #fff;
}
#news h2 img {
	display: inline-block;
	width: 19%;
	margin: 0;
}
#news h2 a {
    float: right;
	width: 20%;
    margin-top: 8px;
}

#news ul {
	float: none;
	height: auto;
	margin: 0;
	white-space: normal;
}
#news li {
	width: 100%;
	height: auto;
}
#news a {
	font-size: 12px;
	line-height: 1.3;
}
#news a div {
	padding: 3.125%;
}
#news time {
	font-size: 10px;
}
#news a p {
	width: auto;
}

/* indexContents
---------------------------------------- */

#indexContents {
	padding: 6.25% 3.125% 4.68725%;
}

#bnr {
	float: none;
	width: 100%;
	display: none;
}
#bnr li {
	width: 48.33%;
	margin: 0 0 1.67%;
}
#bnr li:nth-child(2n) {
	float: right;
}

#social {
	float: none;
	clear: both;
	width: auto;
	padding-top: 1.67%;
	text-align: center;
}

#twitterArea {
	margin-bottom: 4.6875%;
	border-bottom-width: 2px;
}
#twitterArea h2 {
	position: relative;
	padding-top: 17%;
}
#twitterArea h2 a {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/sp/index/twitter_title.png);
	background-size: cover;
}
#twitterArea h2 img {
	display: none;
}

/* Break Point*/
}