/*========================================================================
//
// common
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width:761px) {
	html, body {
		height: 100%;
		font-size: calc(100vw / 37.5);
	}
	article {
		overflow: hidden;
	}
	.wrapper {
		padding: 0 6%;
		position: relative;
	}
	.pc_contents {
		display: none;
	}
}
/*========================================================================
//
// header
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width: 761px) {
	#ghead {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		z-index: 900;
	}
	.ci_wrap {
		width: 100%;
		margin: 0;
	}
	#ci {
		width: 50%;
		margin: 17px 0 0 18px;
		filter: brightness(0) invert(1);
	}

	.who #ci {
		filter:none;
	}

	
	/* head_navi start ------------------ */
	#head_navi {
		display: none;
	}
	/* head_navi end ------------------ */
}
/*========================================================================
//
// Page Top
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width: 761px) {
	.pagetop {
		position: fixed;
		right: -80px;
		bottom: 0;
		transform: translate(0, -50%);
		z-index: 9000;
		transition: all 0.8s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	.pagetop_act {
		right: -18px;
	}
	.pagetop li a {
		display: block;
		background: #000000 url(/global/img/arrow_w2.png) no-repeat 16px center;
		background-size: 14px auto;
		width: 64px;
		height: 44px;
		transform: translate(0, 0);
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
}


/*========================================================================
//
// btn_view
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width:761px)  {
	.btn_view a {
		display: block;
		font-family: "Oswald", sans-serif;
		font-weight: 400;
		font-size: 1.6rem;
		line-height: 1;
		padding: 20px 12px 20px 12px;
		text-align: center;
		width: 180px;
		letter-spacing: 0.1rem;
		font-feature-settings: 'palt';
		color: #fff;
		background: #005bac;
	}
	.btn_view a span {
		font-size: 1.3rem;
		font-weight: 500;
		padding: 0 0 0 14px;
	}
}
/*========================================================================
//
// Hamburger menu
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width:761px) {
	/* Menu ----------------------------- */
	#drawer-icon {
		position: fixed;
		cursor: pointer;
		display: inline-block;
		height: 60px;
		width: 60px;
		top: 0;
		right: 0;
		z-index: 9999;
		background: #005bac;
		transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
	}
	#drawer-icon span {
		background: #fff;
		border-radius: 4px;
		display: block;
		height: 2px;
		position: absolute;
		top: 40%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		transition: all 0.3s ease-in-out;
		width: 22px;
	}
	#drawer-icon span::before, #drawer-icon span::after {
		background: #fff;
		border-radius: 2px;
		content: "";
		display: block;
		height: 100%;
		position: absolute;
		top: 50%;
		left: 0;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		transform: rotate(0);
		transition: all 0.3s ease-in-out;
		width: 22px;
	}
	#drawer-icon span::before {
		margin-top: -30%;
	}
	#drawer-icon span::after {
		margin-top: 24%;
	}
	#drawer-icon.fix {}
	#drawer-icon:after {
		content: "MENU";
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		font-size: 1.0rem;
		letter-spacing: 1px;
		line-height: 100%;
		color: #fff;
		margin: 40px 0 0 0;
		text-align: center;
		display: block;
	}
	/* CLOSE ----------------------------- */
	#drawer-close-icon {
		position: absolute;
		cursor: pointer;
		display: inline-block;
		width: 60px;
		top: 0;
		right: 0;
		z-index: 9999;
		box-sizing: border-box;
		height: 62px;
	}
	#drawer-close-icon:after {
		content: "CLOSE";
		font-family: 'Barlow', sans-serif;
		font-weight: 500;
		font-size: 1.2rem;
		letter-spacing: 0.1rem;
		line-height: 100%;
		color: #fff;
		margin: 37px 0 0 0;
		text-align: center;
		display: block;
	}
	#drawer-close-icon span {
		display: block;
		height: 100%;
		position: absolute;
		top: 34%;
		left: 51%;
		transform: translate(-50%, -50%);
		width: 100%;
	}
	#drawer-close-icon span::before, #drawer-close-icon span::after {
		content: "";
		background: #fff;
		display: block;
		height: 2px;
		width: 20px;
		position: absolute;
		top: 50%;
		left: 32%;
		transform: translate(-50%, -50%);
	}
	#drawer-close-icon span::before {
		transform: rotate(-45deg);
	}
	#drawer-close-icon span::after {
		transform: rotate(45deg);
	}
	/* menu area　----------------------------- */
	#drawer-content {
		position: fixed;
		top: 0;
		right: 0;
		z-index: 10001;
		width: calc(100vw*0.8);
		max-width: 90%;
		height: 100%;
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		background: #005bac;
		transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
		transform: translateX(100%);
	}
	#drawer-content.act {
		overflow-y: auto;
		overflow-x: hidden;
		transform: translateX(0);
		box-shadow: 6px 0 25px rgba(0, 0, 0, 0.16);
	}
	#drawer-content-inner {
		width: 100%;
		height: 100%;
		overflow-y: auto;
		overflow-x: hidden;
	}
	#drawer-close {
		display: none;
		cursor: pointer;
		position: fixed;
		z-index: 10000;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		transition: all 0.3s ease-in-out 0s;
	}
	#drawer-close.act {
		display: block;
	}
	.no_accordion_btn_wrap {
		width: calc(80vw - 60px);
		display: flex;
		position:relative;
	}
	.no_accordion_btn_wrap:before{
		content: "";
		display: block;
		width: 100%;
		height: 1px;
		background:rgb(255 255 255 / 50%);
		position: absolute;
		bottom: 0;
		left: 70px;
	}
	.no_accordion_btn_wrap li {
		line-height: 0;
		width: 26%;
	}
	.no_accordion_btn_wrap a {
		font-family: 'Barlow', sans-serif;
		font-weight: 500;
		font-size: 1.3rem;
		padding: 37px 12px 11px;
		letter-spacing: 0.1rem;
		text-align: center;
		line-height: 100%;
		display: block;
		color: #005bac;
		background: rgb(255 255 255 / 90%);
		position: relative;
	}
	.no_accordion_btn_wrap > li.info a {
		background: #66ccff;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		font-size: 1.2rem;
		padding: 37px 0 13px;
		text-align: center;
		line-height: 100%;
		color: #fff;
	}
	.no_accordion_btn_wrap > li.eng a {
		background: none;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		font-size: 1.2rem;
		text-align: center;
		padding: 37px 0 13px;
		line-height: 100%;
		color: #fff;
	}
	.no_accordion_btn_wrap > li:first-child a span {
		display: block;
		width: 22px;
		position: absolute;
		top: 19px;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.no_accordion_btn_wrap > li.info a span {
		display: block;
		position: absolute;
		top: 19px;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.no_accordion_btn_wrap > li.info {
		border: none;
		width: 38%;
	}
	.no_accordion_btn_wrap > li.eng a span {
		display: block;
		position: absolute;
		top: 20px;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.no_accordion_btn_wrap > li.eng {
		box-sizing: border-box;
		width: 36%;
		height: 62px;
		border-right: 1px solid rgb(255 255 255 / 50%);
	}
	input.accordion {
		display: none;
	}
	.accordion_btn_wrap li a {
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 500;
		font-size: 1.4rem;
		display: block;
		color: #ffffff;
		opacity: 0.8;
		padding: 10px 0 9px 26px;
		position: relative;
	}

	.accordion_btn_wrap li a span{
		margin: 0 0 0 4px;
		font-weight: 300;
		font-size: 1.3rem;
		letter-spacing: 0.1rem;
	}

	.accordion_btn_wrap li a span.ss{
		font-weight: 300;
		font-size: 1.2rem;
		display: block;
		margin: -4px 0 0 6px;
	}
	.accordion_btn_wrap li a span.sa{
		font-weight: 300;
		font-size: 1.3rem;
		display: block;
		margin: -2px 0 0 18px;
	}
	.accordion_btn_wrap li a span.sb{
		font-weight: 300;
		font-size: 1.2rem;
		display: block;
		margin: -2px 0 0;
	}
	.accordion_btn_wrap > li:first-child {
		padding: 18px 0 0;
	}
	.accordion_btn_wrap > li:last-child {
		padding: 0 0 18px;
	}
	.accordion_btn_wrap li a .arrow {
		display: inline-block;
		font-size: 1.2rem;
	}
	.accordion_btn_wrap .list_sub {
		padding: 0 0 18px;
		margin:0 0 10px 16px;
		border-bottom: 1px dotted rgb(255 255 255 / 50%);
	}
	.accordion_btn_wrap .list_sub a {
		font-size: 1.3rem;
		padding: 5px 0 2px 46px;
	}
	.accordion_btn_wrap .list_sub a span {
		display: inline-block;
		font-weight:300;
		margin: 0 0 0 3px;
	}
	.accordion_btn_wrap .list_sub a .arrow2 {
		display: inline-block !important;
		font-size: 1.2rem !important;
		margin: 0 !important;
		position: absolute;
		left: 27px;
		top: 8px;
		transform: rotate(90deg);
	}
	/* lang BTN */
	.menu_language_wrap{
		display:flex;
		gap: 15px;
		position:relative;
		margin: 17px 0 0 22px;
		padding: 0 0 0 30px;
	}
	.menu_language_wrap:before{
		content:"";
		background: url(/global/img/icon_globe_gr.svg) no-repeat 0 center;
		background-size:cover;
		position: absolute;
		width:20px;
		height:20px;
		top: 1px;
		left:0;
		filter: brightness(0) invert(1);
	}
	.menu_language_wrap a{
		color:#fff;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 300;
		font-size: 1.2rem;
	}

	.glay_a a{
		color:#61a4e0;
		pointer-events: none;
	}

	.menu_contact_wrap{
		margin:30px 0;
	}
	.menu_contact_wrap a{
		width: 80%;
		background: #66ccff url(/global/img/icon_mail.svg) no-repeat 0 center;
		background-position: 16% center;
		border-radius: 33px;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		font-size: 1.5rem;
		font-feature-settings: 'palt';
		line-height:1;
		padding: 20px 0 20px 14px;
		margin: 10px auto 0;
		letter-spacing:0.2rem;
		display:block;
		box-sizing: border-box;
		color: #fff;
		position:relative;
		text-align: center;
	}
	.menu_contact_wrap li:nth-child(2) a{
		background: #99cc00 url(/global/img/icon_dl.svg) no-repeat 0 center;
		background-position: 8% center;
		background-size: 23px;
	}
	/* ac BTN */
	.menu_ac_wrap-first{
		border-top: 1px solid rgb(255 255 255 / 40%);		
	}
	.menu_ac_wrap li {
		border-bottom: 1px solid rgb(255 255 255 / 40%);
	}
	.menu_ac_wrap li a {
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		font-size: 1.4rem;
		display: block;
		letter-spacing: 1px;
		padding: 16px 0 18px 22px;
		position: relative;
		color: #fff;
	}
	.menu_ac_wrap li a:before {
		position: absolute;
		content: "";
		top: 50%;
		right: 20px;
		width: 12px;
		transition: all 0.5s ease 0s;
		border-top: 1px solid #fff;
		transform: rotate(0);
	}
	.menu_ac_wrap li a:after {
		position: absolute;
		content: "";
		top: 50%;
		right: 20px;
		width: 12px;
		transition: all 0.5s ease 0s;
		border-top: 1px solid #fff;
		transform: rotate(90deg);
	}
	.menu_ac_wrap li a.no_plus:before, .menu_ac_wrap li a.no_plus:after {
		border-top: none;
	}
	/* ac BTN active */
	.menu_ac_wrap li a.active {
		background: rgb(2 90 141 / 70%);
	}
	.menu_ac_wrap li a.active:before {
		transform: rotate(180deg);
	}
	.menu_ac_wrap li a.active:after {
		transform: rotate(360deg);
	}
	.menu_ac_contents {
		background: #126b938f;
	}
	.scroll-prevent {
		position: fixed;
		z-index: -1;
		width: 100%;
		height: 100%;
		top: 0;
		right: 0;
	}
}
/*========================================================================
//
// info float btn
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width:761px) {
	.info_cv_btn {
		position: fixed;
		right: 160px;
		top: -70px;
		z-index: 9000;
		transition: all 0.8s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	.info_cv_btn2 {
		position: fixed;
		right: 60px;
		top: -70px;
		z-index: 9000;
		transition: all 0.8s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	.info_cv_btn_act {
		top: 0;
	}
	.info_cv_btn li a {
		display: block;
		background: rgb(102 204 255 / 80%);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		width: 100px;
		height: 60px;
		box-sizing: border-box;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		font-size: 1.2rem;
		letter-spacing: 0.1rem;
		line-height: 1;
		text-align: center;
		padding: 39px 0 0 0;
		color: #fff;
		position: relative;
		transform: translate(0, 0);
		transition: all 0.4s cubic-bezier(0.03, 0.36, 0.18, 1) 0s;
	}
	.info_cv_btn2 li a{
		background: rgb(153 204 0 / 80%);
		padding: 33px 0 0 0;
		font-size: 1.1rem;
	}
	.info_cv_btn li a span {
		display: block;
		width: 20px;
		position: absolute;
		top: 15px;
		left: 50%;
		transform: translate(-50%, 0);
	}
}
/*========================================================================
//
// footer
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width:761px) {
	footer {
		background: #ffffff;
		position: relative;
	}
	#f_catalog_wrap{
		text-align:center;
		position:relative;
		padding: 100px 0 0;
	}	
	#f_catalog_wrap .img_box {
	}
	#f_catalog_wrap .img_box img{
		z-index:1;
		position: relative;
	}
	#f_catalog_wrap h2 {
		display: inline-block;
		font-family: "Oswald", sans-serif;
		font-weight: 500;
		font-size: 4.0rem;
		letter-spacing: 0.1rem;
		font-feature-settings: 'palt';
		line-height: 1.0;
		color: #000000;
		text-align:center;
		position: relative;
		z-index: 1;
	}
	#f_catalog_wrap h2 span {
		display: block;
		font-family: "Noto Sans SC", sans-serif;
		font-size: 1.8rem;
		font-weight: 400;
		line-height: 1;
		padding: 10px 0 0;
	}
	#f_catalog_wrap .btn_view a{
		margin:0 auto;
		position: relative;
		z-index: 1;
	}
	#f_catalog_wrap .gray-band{
		position:absolute;
		width:100%;
		height: 220px;
		bottom: 18px;
		background:#F6F6F6;
		z-index: 0;
	}
	#f_company_wrap{
		text-align:center;
		padding: 90px 0 0;
	}	
	#f_company_wrap h2 {
		display: inline-block;
		font-family: "Oswald", sans-serif;
		font-weight: 500;
		font-size: 4.0rem;
		font-feature-settings: 'palt';
		line-height: 1.0;
		color: #005bac;
		text-align:center;
	}
	#f_company_wrap h2 span {
		display: block;
		font-family: "Noto Sans SC", sans-serif;
		font-size: 1.8rem;
		font-weight: 400;
		line-height: 1;
		padding: 10px 0 0;
	}
	#f_company_wrap .flex_base{
		background-color: #005bac;
		padding: 56px 0;
		margin: 43px 0 0;
	}
	#f_company_wrap .flex_wrap{
		margin: 0 auto;
		text-align: center;
		padding: 0 8%;
	}
	#f_company_wrap .flex_wrap li{
	width: 100%;
	margin: 0 0 10px;
	}
	#f_company_wrap .flex_wrap a{
		transition: all 0.5s ease 0s;
	}
	#f_company_wrap .flex_wrap a :hover{
		opacity:0.8;
		transition: all 0.5s ease 0s;

	}
	/* f_site_map start */
	#f_info_wrap {
		padding: 80px 0 90px;
		position: relative;
		background-image: url(../img/foot_bg.png);
		background-size:cover;
	}
	#f_info_wrap .f_bg_icon01, #f_info_wrap .f_bg_icon02 {
		position: absolute;
	}
	#f_info_wrap .f_bg_icon01 {
		top: 30px;
		left: calc(50% + 72px);
		width: 20vw;
	}
	#f_info_wrap .f_bg_icon02 {
		bottom: 12px;
		right: calc(50% + 100px);
		width: 10vw;
	}
	#f_info_wrap h2 {
		font-family: 'Barlow', sans-serif;
		font-weight: 600;
		letter-spacing: 0rem;
		font-size: 3.4rem;
		line-height: 1.2;
		font-feature-settings: 'palt';
		color: #fff;
		text-align: center;
		padding: 0 0 26px;
	}
	#f_info_wrap h2 span {
		font-family: "Noto Sans SC", sans-serif;
		display: block;
		font-weight: 400;
		font-size: 1.7rem;
		letter-spacing: 0.2rem;
		line-height: 1.4;
		padding: 7px 0 0;
	}
	#f_info_wrap a {
		display: block;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		letter-spacing: 0rem;
		font-size: 1.5rem;
		background: #005bac;
		text-align: center;
		color: #fff;
		width: 62vw;
		box-sizing: border-box;
		border: 1px solid #fff;
		padding: 10px 0 12px;
		text-indent: 30px;
		border-radius: 4px;
		margin: 0 auto;
		position: relative;
	}
	#f_info_wrap a > span {
		display: block;
		width: 21px;
		line-height: 0;
		position: absolute;
		left: calc(50% - 122px);
		top: 50%;
		transform: translate(0, -50%);
	}
	/* f_site_map start */
	#f_site_map {
		padding: 40px 6% 18px;
		position: relative;
	}
	#f_site_map > p {
		width: 55vw;
	}
	#f_site_map .link_BACHEM {
		margin: 70px 0 0;
	}
	#f_site_map .link_BACHEM li {
		display: flex;
		justify-content: space-between;
	}
	#f_site_map .bechem_ci {
		line-height: 0;
		margin: 5px 0 0;
	}
	#f_site_map .link_BACHEM p {
		display: block;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		letter-spacing: 0.1rem;
		font-size: 1.1rem;
		line-height: 1.4;
		color: #9a9a9a;
	}
	#f_site_map .link_BACHEM p a {
		display: inline-block;
		color: #c1c1c1;
		padding: 0 2px;
		text-decoration: underline !important;
	}
	#f_site_map .link_list {
		display: none;
	}
	/* f_copyright_wrap start */
	#f_copyright_wrap {
		margin: 0 6%;
		display: flex;
		flex-wrap: wrap;
		padding: 14px 0 22px;
		border-top: 1px solid #5b5e62;
	}
	#f_copyright_wrap p {
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 300;
		font-size: 1.3rem;
		color: #000000;
		order: 2;
		padding: 40px 0 0;
	}
	#f_copyright_wrap ul {
		width: 100%;
		display: flex;
		justify-content: space-between;
	}
	#f_copyright_wrap ul li {}
	#f_copyright_wrap a {
		display: block;
		font-family: "Noto Sans SC", sans-serif;
		font-weight: 400;
		letter-spacing: 0.1rem;
		font-size: 1.1rem;
		color: #000000;
	}
}
/*========================================================================
//
// GDPR Cookie
//
//========================================================================*/
/********* SP - iPhone 6 or higher (screen width up to 761px) ************/
@media (max-width:761px) {
	.g-gdpr {
		width: 80%;
		padding: 30px 10%;
		justify-content: center;
		align-items: center;
		background: rgba(0, 0, 0, .75);
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 10000;
		-webkit-backdrop-filter: blur(15px);
		backdrop-filter: blur(15px);
		transition: 1s;
		transform: translateY(100%);
		animation: anime-gdpr 1s both 1s;
	}
	.is-gdpr_off .g-gdpr {
		animation: anime-gdpr_off 1s both;
	}
	.g-gdpr__text {
		display: block;
		color: #cacaca;
		text-shadow: 0 0 3px #000;
		padding: 0 0 20px;
		font-size: 1.4rem;
	}
	.g-gdpr__text a {
		color: #85b9d0;
		text-decoration: underline !important;
		padding: 0 .15em;
		display: inline-block;
	}
	a.g-gdpr__button {
		color: #fff;
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1;
		text-align: center;
		white-space: nowrap;
		vertical-align: middle;
		padding: 1em 2em 1em 2em;
		display: block;
		background: #0096df;
		border: 1px solid #fff;
		transition: .2s;
		cursor: pointer;
	}
}