@charset "Shift_JIS";
/* CSS Document */


/*=================box-sizing================*/

*:not(#SiteIdentityP) {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/*=================clearfix================*/
.clearfix:after {
    content: "";         /* 擬似要素を実体化 */
    clear: both;        /* floatを解除する */
    display: block;     /* ブロック要素にする */
}


/*=========================================

	top-image

=========================================*/


#xtech-Popup {
  padding: 0;
}

#xtech-Popup #MainImageWrap {
    padding: 19px 15px 5px 15px;
}

#xtech-Popup .contentsWidth {
		max-width: 965px;
		width: 100%;
		margin: auto;
		text-align: center;
}

#xtech-Popup .contentsWidth h1 {
		font-size: 200%;
		font-weight: bold;
		color: #fff;
}

#xtech-Popup #BrandingImgStyle1  {
	background-color: transparent;}

#xtech-Popup #BrandingImgStyle1 img {
		max-width: 965px;
		width: 100%;
}


p.Collabo {
		border-bottom: thin solid #fff;
		border-top: thin solid #fff;
		display: inline-block;
		margin: auto auto 15px;
		color: #fff;
		font-size: 120%;
		font-weight: bold;
		padding: 5px 10px 0;}



/*=========================================

	Maincopy

=========================================*/


#xtech-Popup .lead-Section {padding: 20px 15px 15px 15px;
		max-width: 965px;
		width: 100%;	
		margin: auto auto 30px;
}
.MainCopy {
		position: relative;
}

.MainCopy h3 {
		color: #fff;
		font-size: 140%;
		font-weight: bold;
		text-align: center;
		margin-bottom: 5px;
}

.MainCopy p {
		font-size: 110%;
		color: #fff;
		margin-bottom: 10px;
		line-height: 1.8em;
}

.MainCopy::after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    transform: rotate(135deg);
    margin-right: 5px;
	margin-bottom: 10px;
	position: absolute;
	right: 48%;
}

/*=========================================

	contents

=========================================*/

/* for Design Guideline Ver. 5 */
body #Popup #Contents {
	padding-top: 0;
}

#xtech-Popup .Section {padding: 20px 15px 15px 15px;
		max-width: 965px;
		width: 100%;	
		margin: auto;
}

.SectionInner {
		margin-top: 50px;
}


.SectionInner h2 {
		font-size: 160%;
		font-weight: bold;
		text-align: center;
		line-height: 1.4em;
		padding-bottom: 20px;
		margin-bottom: 30px;
	}

#xtech-Popup .SectionInner p {
		line-height: 1.8em;
}

#xtech-Popup .SectionInner > p img {
		max-width: 780px;
		width: 100%;
}

#xtech-Popup .ImgOnlyStyle {
		color: #666;
		font-weight: bolder;
}

#xtech-Popup .mb20 {
		margin-bottom: 20px;
}


.AdditionalNotesStyle2 {
	margin-top: 15px;
	color: #666;
}

#xtech-Popup dl.AdditionalNotesStyle2 dd {
	float: left;
	clear: both;
	margin-left: 1.5em;
}

#xtech-Popup .ListStyle2 {
	color: #666;
}

/*=========================================

	関連リンク・お問い合わせ

=========================================*/

#xtech-Popup h4 {
		font-size: 150%;
		font-weight: bold;
		text-align: center;
		line-height: 1.4em;
		padding-bottom: 20px;
		margin-bottom: 30px;
	}

.Section-link ul {margin: 0 8% 50px;}

.Section-link ul li {
	line-height: 1.8em;
	font-size: 110%;
	}

.Section-inquiry {
	margin: 0 8% ;
	text-align: center;}

.Section-inquiry p {
	line-height: 1.8em;
	font-size: 110%;
	}

.Section-inquiry p.con-info {
	font-size: 160%;
	font-weight: bold;
}

a.info-btn {
	border-radius: 30px;
	display: inline-block;
	padding: 12px 30px 10px;
	color: #fff;
	font-size: 16px;
	text-decoration: none;
	font-weight: bold;
	margin: 15px 0 30px;
	transition: all .2s;
}

.dainari::before {
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 7px;
	height: 7px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
	margin-right: 5px;
	margin-top: -3px;
}

a.info-btn:hover {
	  opacity: 0.6;
}



/*==============================================
================================================

	トップイメージ用
    画面サイズが830px以上はここを読み込む

================================================
==============================================*/

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

#BrandingImgStyle1-sp img {display: none;}	

}


/*==============================================
================================================

	トップイメージ用
    画面サイズが768pxから829pxまではここを読み込む

================================================
==============================================*/

@media screen and (min-width:768px) and ( max-width:829px) {

#xtech-Popup div#MainImageWrap div.contentsWidth h1 {font-size: 3.7vw;}
	
#BrandingImgStyle1-sp img {display: none;}	
}



/*==============================================
================================================

	トップイメージ・関連リンク用
    画面サイズが767px以下はここを読み込む

================================================
==============================================*/

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

	
#xtech-Popup div#MainImageWrap div.contentsWidth img {display: none;}
#xtech-Popup div#MainImageWrap div.contentsWidth h1 {display: none;}
#xtech-Popup div#MainImageWrap div.contentsWidth p {display: none;}	

#xtech-Popup .nosp {display: none;}	 	

	.JS .SectionInner h2 {
		padding-left: 15px;
		padding-right: 15px;
	}
}