@charset "utf-8";
@media only screen and (max-width: 750px) {
	/*--------------------*/
	/*---- sp_cont.css ----*/
	/*--------------------*/

	/*------------------------------------
		基本設定
	-------------------------------------*/
	html {
		font-size: 62.5%;
		overflow: auto;
	}

	body {
		font-size: 1.6em;
		line-height: 1.7;
		overflow: hidden;
		background: #fff;
		/* text-align: justify; */
	}

	img {
		width: 100%;
		max-width: 100%;
		height: auto;
		vertical-align: bottom;
	}

	.spNone {
		display: none;
	}

	/*ーーーーー
	※レイアウト調整用
	* {
		outline: 1px solid #555;
	}
	ーーーーー*/

	/*------------------------------------
		section共通設定
	-------------------------------------*/
	.sectionCommon {
		padding: 0 5.3vw;
	}

	/*------------------------------------
		大項目(これは見本)
	-------------------------------------*/
	/* --------- 中項目(これは見本) ----------- */
	/* 小項目(これは見本) */


	/*------------------------------------
		header
	-------------------------------------*/
	header {
		height: 130px;
		background-image: url(../img/common/header/bg_header_sp.png);
		background-position: top center;
		background-repeat: no-repeat;
		background-size: 1500px 132px;
		z-index: 999;
	}
	header .sectionCommon{
		position: relative;
	}
	header .logoSumitomoKenki {
		position: absolute;
		display: inline-block;
		top: 20px;
		left: 15px;
	}
	header .logoSumitomoKenki img {
		width: 184px;
		height: 18px;
		vertical-align: top;
	}
	header .badge {
		position: absolute;
		top: 10px;
		right: 5px;
	}
	header .badge img {
		width: 120px;
		height: 128px;
	}


	/*------------------------------------
		コンテンツ
	-------------------------------------*/
	.mainSection {
		margin-top: -160px;
	}
	.mainSection .sectionCommon {
		padding-top: 180px;
		text-align: center;
	}
	.mainSection .mainSectionInner {
		margin: 0 auto;
		text-align: center;
		background-image: url(../img/top/sp/bg_main_section.jpg);
		background-repeat: no-repeat;
		background-position: center 30px;
		background-size: 100%;
	}
	.mainSection .txDateAndTime {
		margin-top: 30px;
		margin-left: 3px;
	}
	.mainSection .dateVenueBox {
		display: inline-flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		text-align: left;
		color: #E85504;
		font-size: 1.8rem;
		font-weight: var(--font-w-black);
		line-height: 1.55;
	}
	.mainSection .dateVenueBox > div {
		display: grid;
		grid-template-columns: 55px minmax(0, 1fr);
		column-gap: 12px;
		align-items: start;
	}
	.mainSection .dateVenueBox .label {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 55px;
		margin-top: 3px;
		padding: 5px 10px 6px;
		border-radius: 5px;
		background: #E85504;
		color: #fff;
		font-size: 1.4rem;
		font-weight: var(--font-w-bold);
		line-height: 1;
		white-space: nowrap;
	}
	.mainSection .mainBottom {
		position: relative;
		min-height: 531px;
		margin-top: 53px;
		text-align: left;
	}
	.mainSection .mainBottomLeft {
		width: 100%;
	}
	.mainSection .wrapCopy {
		text-align: center;
	}
	.mainSection .tx_copy {
		width: 85%;
	}
	.mainSection .mainBottomLeft .tx1 {
		margin-top: 40px;
		margin-bottom: 18px;
		font-size: 2.3rem;
		font-weight: var(--font-w-bold);
		line-height: 1.4;
	}
	.mainSection .mainBottomLeft .tx2 {
		margin-bottom: 25px;
		line-height: 1.8;
	}
	.mainSection .mainBottom .images {
		position: relative;
	}
	.mainSection .mainBottom .images .sh200 {
		width: 100%;
		height: auto;
	}

	.ourFocusSection {
		margin-top: -63px;
	}
	.ourFocusSection .ourFocusSectionInner {
		margin: 0 auto;
		padding: 80px 0 50px;
		background-image: url(../img/top/pc/bg_our_focus.jpg);
		background-repeat: no-repeat;
		background-size: 100% 100%;
	}
	.ourFocusSection .title {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		margin-bottom: 30px;
		color: #fff;
	}
	.ourFocusSection .title .tx1 {
		font-size: 3.0rem;
		font-weight: var(--font-w-black);
		line-height: 1.2;
	}
	.ourFocusSection .title .tx2 {
		font-size: 1.9rem;
		font-weight: var(--font-w-bold);
		line-height: 1.4;
	}
	.ourFocusSection .wrapOurFocus {
		display: flex;
		flex-direction: column;
		gap: 25px;
	}
	.ourFocusSection .wrapOurFocus > div {
		width: 88%;
		margin: 0 auto;
		padding: 0px 0px 30px;
		outline: 3px solid rgb(255 255 255 / 0.8);
		outline-offset: -3px;
		text-align: center;
	}
	.ourFocusSection .wrapOurFocus .boxTitle {
		display: flex;
		flex-direction: column;
		gap: 7px;
		margin: 12px 12px 10px 12px;
		padding: 17px 17px 10px;
		background: linear-gradient(to bottom, #004097 0%, rgb(0 64 151 / 0) 100%);
		color: #fff;
	}
	.ourFocusSection .wrapOurFocus .boxTitle .tx1 {
		font-size: 2.1rem;
		font-weight: var(--font-w-bold);
		line-height: 1.4;
		color: #6DCCFF;
	}
	.ourFocusSection .wrapOurFocus .boxTitle img {
		width: 74px;
		height: auto;
	}
	.ourFocusSection .wrapOurFocus .boxTitle .tx2 {
		font-size: 2.5rem;
		font-weight: var(--font-w-bold);
		line-height: 1.3;
	}
	.ourFocusSection .wrapOurFocus .tx {
		margin: 0px 25px 0px 25px;
		text-align: left;
		color: #fff;
	}

	.technologySection {
		margin-top: 50px;
	}
	.technologySection .title {
		margin-bottom: 30px;
		font-size: 2.8rem;
		font-weight: var(--font-w-black);
		line-height: 1.4;
		text-align: center;
	}
	.technologySection .boxTxHead {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 7px;
		padding: 15px 20px 17px 20px;
		background: linear-gradient(to right, #0081C9 0%, #0E308A 100%);
		color: #fff;
		text-align: center;
	}
	.technologySection .boxTxHead .tx1 {
		font-size: 2.4rem;
		font-weight: var(--font-w-black);
		line-height: 1.3;
	}
	.technologySection .boxTxHead .tx2 {
		font-size: 1.7rem;
		font-weight: var(--font-w-bold);
		line-height: 1.6;
	}
	.technologySection .wrapBoxCont {
		padding: 30px 20px 40px 20px;
		background: #DFF4FF;
	}
	.technologySection .wrapBoxCont.first {
		margin-bottom: 55px;
	}
	.technologySection .wrapBoxCont .box2Column {
		display: flex;
		flex-direction: column;
		gap: 50px;
	}
	.technologySection .wrapBoxCont .box2Column > div {
		width: 100%;
	}
	.technologySection .wrapBoxCont .boxColumn {
		display: flex;
		flex-direction: column;
		gap: 40px;
	}
	.technologySection .wrapBoxCont .boxColumn.relative {
		position: relative;
		margin-bottom: 40px;
	}
	.technologySection .wrapBoxCont .boxColumn .w_700 {
		width: 100%;
	}
	.technologySection .sh135x-8 {
		position: relative;
		width: 85%;
		height: auto;
		margin: -10px auto 0px auto;
	}
	.technologySection .wrapSpecLabel {
		display: flex;
		gap: 10px;
		margin-bottom: 9px;
	}
	.technologySection .specLabel {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 5px 12px 7px 12px;
		border: 1px solid #0081C9;
		font-size: 1.2rem;
		font-weight: var(--font-w-medium);
		line-height: 1;
		border-radius: 4px;
	}
	.technologySection .specLabelDevelopment {
		background: #0081C9;
		color: #fff;
	}
	.technologySection .specLabelDemo {
		background: #fff;
		color: #004097;
		border: 1px solid #004097;
	}
	.technologySection .specTitle {
		position: relative;
		margin-bottom: 16px;
		padding-bottom: 17px;
		font-size: 2.0rem;
		font-weight: var(--font-w-black);
		line-height: 1.3;
		color: #004097;
	}
	.technologySection .specTitle::after {
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 5px;
		background: linear-gradient(to right, #0081C9 0%, rgb(0 129 201 / 0) 100%);
	}
	.technologySection .specTitle .txS {
		font-size: 1.6rem;
		font-weight: var(--font-w-black);
		line-height: 1.3;
	}
	.technologySection .wrapBuBox {
		display: flex;
		flex-direction: column;
		gap: 15px;
		margin-top: 22px;
	}
	.technologySection .linkBtn {
		position: relative;
		display: flex;
		align-items: center;
		width: 100%;
		min-height: 57px;
		padding: 12px 50px 14px 25px;
		border: 2px solid #007BD0;
		background: #fff;
		box-shadow: 2px 2px 0 #007BD0;
		color: #007BD0;
		font-size: 1.5rem;
		font-weight: var(--font-w-black);
		line-height: 1.4;
		text-decoration: none;
		transition: background 0.2s, color 0.2s;
	}
	.technologySection .linkBtn::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 20px;
		width: 6px;
		height: 6px;
		border-top: 3px solid currentColor;
		border-right: 3px solid currentColor;
		transform: translateY(-50%) rotate(45deg);
		transition: border-color 0.2s;
	}
	.technologySection .linkBtn span {
		display: block;
	}
	.technologySection .linkBtn:hover {
		background: #007BD0;
		border-color: #0062A4;
		box-shadow: 2px 2px 0 #0062A4;
		color: #fff;
	}
	.technologySection .linkBtn:hover::after {
		border-color: #fff;
	}

	.locationSection {
		margin-top: 55px;
	}
	.locationSection .title {
		margin-bottom: 30px;
		font-size: 2.7rem;
		font-weight: var(--font-w-medium);
		line-height: 1.2;
		text-align: center;
	}
	.locationSection .locationBox {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		background: #fff;
		color: #111;
	}
	.locationSection .locationInfo {
		width: 100%;
	}
	.locationSection dl {
		margin: 0;
	}
	.locationSection dl > div {
		display: flex;
		flex-direction: column;
		gap: 8px;
		padding: 20px 0;
		border-bottom: 1px solid #D9D9D9;
	}
	.locationSection dl > div:first-child {
		border-top: 1px solid #D9D9D9;
	}
	.locationSection dt,
	.locationSection dd {
		padding: 0 0 0 0;
		font-size: 1.5rem;
		font-weight: var(--font-w-bold);
		line-height: 1.55;
	}
	.locationSection dt {
		width: 90px;
		flex-shrink: 0;
	}
	.locationSection dd {
		margin: 0;
		flex: 1;
		font-weight: var(--font-w-regular);
	}
	.locationSection .eventLink {
		margin-top: 27px;
		font-size: 1.5rem;
		font-weight: var(--font-w-bold);
		line-height: 1.5;
	}
	.locationSection .eventLink span {
		display: block;
		line-height: 1.7;
	}
	.locationSection .eventLink a {
		color: #0081C9;
		text-decoration: none;
	}
	.locationSection .eventLink a:hover {
		text-decoration: underline;
	}
	.locationSection .contactTx {
		margin: 30px 0 0;
		font-size: 1.3rem;
		font-weight: var(--font-w-regular);
		line-height: 1.7;
	}
	.locationSection .locationMap {
		margin-top: 45px;
	}
	.locationSection .locationMap img {
		width: 100%;
		height: auto;
	}

	.registrationSection {
		margin-top: 60px;
	}
	.registrationSection .wrapRegistration {
		padding: 30px 20px 40px;
		background: #FFF1CC;
		text-align: left;
	}
	.registrationSection .registrationLead {
		margin: 0 0 22px;
		font-size: 1.5rem;
		font-weight: var(--font-w-medium);
		line-height: 1.5;
	}
	.registrationSection .registrationBtn {
		position: relative;
		display: inline-flex;
		align-items: center;
		width: 100%;
		padding: 17px 50px 20px 25px;
		border: 2px solid #660000;
		background: #D00000;
		box-shadow: 3px 3px 0 #6E0000;
		color: #fff;
		font-size: 2.2rem;
		font-weight: var(--font-w-bold);
		line-height: 1.3;
		text-decoration: none;
		transition: background 0.2s, color 0.2s;
	}
	.registrationSection .registrationBtn::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 22px;
		width: 10px;
		height: 10px;
		border-top: 4px solid currentColor;
		border-right: 4px solid currentColor;
		transform: translateY(-50%) rotate(45deg);
		transition: border-color 0.2s;
	}
	.registrationSection .registrationBtn span {
		display: block;
	}
	.registrationSection .registrationBtn:hover {
		background: #fff;
		color: #D00000;
	}
	.registrationSection .registrationBtn:hover::after {
		border-color: #D00000;
	}


	/*------------------------------------
		footer
	-------------------------------------*/
	/* --------- ページトップボタン ----------- */
	#gPagetop {
		transition: 0.3s;
		cursor: pointer;
		visibility: hidden;
	}
	#gPagetop .pagetopBtn {
		position: fixed;
		position: relative;
		right: 10px;
		display: block;
		width: 45px;
		height: 45px;
		border-radius: 100%;
		z-index: 100;
	}
	#gPagetop .pagetopBtn::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0px;
		display: block;
		width: 45px;
		height: 45px;
		border-radius: 100%;
		background-image: url(../img/common/pagetop_icon.svg);
		background-position: center;
		background-size: contain;
		background-repeat: no-repeat;
		transition: all 0.2s ease;
		z-index: 100;
	}

	footer {
		margin-top: 80px;
		padding: 15px 0 18px 0;
		background: linear-gradient(to bottom, #0081C9 0%, #0E308A 100%);
	}
	footer .footerInner {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
	footer .footerLogo img {
		width: 163px;
		height: auto;
	}
	footer .copyright {
		display: block;
		margin-top: 45px;
		color: #fff;
		font-size: 1.0rem;
		font-weight: var(--font-w-regular);
		line-height: 1.3;
	}
}
