@charset "utf-8";
/* CSS Document */

/*** ----------------------------------------------------------------------------- 

reset

-----------------------------------------------------------------------------  ***/
.clearfix:after {
	content:".";
	display:block;
	visibility:hidden;
	clear:both;
	height:0.1px;
	font-size:0.1em;
	line-height:0;

}
.clearfix {
	display:inline-table;
	zoom:1;
}
/*Hides from IE-mac \*/
* html .clearfix {
	height:1%;
}
.clearfix {
	display:block;
}
/* End hide from IE-mac */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin:0px;
	padding:0px;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
address, caption, cite, code, dfn, em, th, var {
	font-style:normal;
	font-weight:normal;
}
ul {
	list-style:none;
}
ol li{
	list-style:none;
}
caption, th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
	font-variant:normal;
}
sup {
	vertical-align:top;
}
sub {
	vertical-align:text-bottom;
}
input, textarea, select {
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
}
input, textarea, select {
 *font-size:100%;
}
legend {
	color:#3FA4D3000;
}
img {
	vertical-align:bottom;
}
table caption {
	font-weight: bold;
	margin:0 0 5px;
}
/*** ------------------------------------------------------------------------------ 

HTML5

-----------------------------------------------------------------------------  ***/
header, footer, nav, section, article, figure, aside {
	display:block;
}
/*** ------------------------------------------------------------------------------ 

common

-----------------------------------------------------------------------------  ***/
html {
	overflow-y:scroll;
}
body {
	color:#333;
	line-height: 1.75;
	font-size: 14px;
	font-weight: 400;
	font-family: "メイリオ", Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ Pro W3", MS PGothic, "ＭＳ Ｐゴシック", Osaka;
}

body.menu-open {
	background:#F5F5F5;
}

/*** ------------------------------------------------------------------------------ 

リンク

-----------------------------------------------------------------------------  ***/
/* 基本 */
a{
	outline:none;
	-webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -o-transition: 0.2s;
    -ms-transition: 0.2s;
}
a:link {
	color: #002c52;
	text-decoration: underline;
}
a:visited {
	color: #002c52;
	text-decoration: underline;
}
a:hover {
	color: #002c52;
	text-decoration: none;
}
a:active {
	color: #002c52;
	text-decoration:underline;
}

/* ページ内リンクの見出しズレ補正 */
.page-scroll-anchor{
	display: block;
	padding-top: 100px;
	margin-top: -100px;
}
@media screen and (max-width: 737px){
	.page-scroll-anchor{
		display: inline-block;
		padding-top: 50px;
		margin-top: -50px;
	}	
}


/*** ------------------------------------------------------------------------------ 

テキストサイズ（ 常時は使用しない / 部分的に使用）

-----------------------------------------------------------------------------  ***/
.text-12{ font-size:12px;}
.text-13{ font-size:13px;}
.text-14{ font-size:14px;}
.text-15{ font-size:15px;}
.text-16{ font-size:16px;}
.text-17{ font-size:17px;}
.text-18{ font-size:18px;}
.text-19{ font-size:19px;}
.text-20{ font-size:20px;}


/*** ------------------------------------------------------------------------------ 

base

-----------------------------------------------------------------------------  ***/
#cont{}

.inner{
	width: 1000px;
	margin:0 auto;
	padding:65px 0;
}


@media screen and (max-width: 737px){
	.inner{
		width: 100%;
		/*padding:5% 3%;*/
		padding:5% 10px;
		box-sizing:border-box;
	}
}

/*** ------------------------------------------------------------------------------ 

float解除

-----------------------------------------------------------------------------  ***/
div:after,
ul:after{
    content: "";
    display: block;
    clear: both;
}


/*** ------------------------------------------------------------------------------ 

text-align

-----------------------------------------------------------------------------  ***/
.align-l{ text-align: left;}
.align-c{ text-align: center;}
.align-r{ text-align: right;}



/*** ------------------------------------------------------------------------------ 

縦書き

-----------------------------------------------------------------------------  ***/
.text-rl {
	display: inline-block;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
}


/*** ------------------------------------------------------------------------------ 

header

-----------------------------------------------------------------------------  ***/
header{
	position:relative;
}
header .inner{
	position:relative;
	padding:0;
}
header .inner h1{
	font-size:12px;
	padding:6px 0;
}

header a,
header a:link,
header a:visited,
header a:hover,
header a:active{
	color:#002c52;
	text-decoration: none;
}

ul.header-contact{
	position:absolute;
	top:25px;
	left:390px;	
	font-size:12px;
}
	ul.header-contact li{ float:left;}
	ul.header-contact li:first-child{
		padding-top: 5px;
		margin-right:15px;
	}

ul.sub-navi{
	position:absolute;	
	top:65px;
	left:390px;
}
	ul.sub-navi li{ float:left;}
	ul.sub-navi li a{
		background: url(/live/oe_/https://www.java-style.com/common/img/arrow01.png) no-repeat left center;
		display:inline-block;
		margin-right:25px;
		padding-left:22px;
	}
	ul.sub-navi li:last-child a{ margin-right:0;}
	ul.sub-navi li a:hover{ text-decoration:underline;}

.header-entry{
	position:absolute;
	top: 18px;
	right:0;
}
	.header-entry a:hover{ opacity:0.7;}
	.header-entry-sp{ display: none;}

@media screen and (max-width:737px){
	header{
		width: 100%;
		left: 0;
		top: 0;
		z-index: 1000;
	}
	header .inner{
		position: fixed;
		background: #fff;
		height: 80px;
		padding:10px;
		box-sizing: border-box;
	}
	header .inner h1{
		display: none;
	}
	ul.header-contact{
		display: none;
	}
	ul.sub-navi{
		display: none;
	}
	.header-entry{
		display: none;
	}
	.header-entry-sp{
		position: absolute;
		top: 10px;
		right: 65px;
		width: 75px;
		height: 60px;
		display: block;
		background: #fdd100;
		border-radius: 5px;
	}
	.header-entry-sp a{
		width: 70px;
		height: 60px;
		display: block;
		background: url(/live/oe_/https://www.java-style.com/common/img/header_entry_sp.png) no-repeat center center;
		background-size: 60px;
	}
}


/*** ------------------------------------------------------------------------------ 

nav

-----------------------------------------------------------------------------  ***/
header nav .ul-first{
	padding:20px 0 23px;
	width: 1000px;
	margin: 0 auto;
}
header nav ul li{
	text-align:center;
	width: 166px;
	float:left;
	border-right:1px solid #e6e6e6;
	box-sizing:border-box;
}
header nav ul li a{
	display: inline-block;
	/*width:calc(100% / 6);*/
	width: 166px;
	padding: 6px 0;
	box-sizing:border-box;
}
header .pc-menu > ul > li:nth-child(4) a{
	background: url(/live/oe_/https://www.java-style.com/common/img/out-link_pc.png) no-repeat right 13px center;
}
header nav ul li a:hover{
	text-decoration: underline;
}
header nav ul li:nth-child(3){
	width: 170px;
}
header nav ul li:nth-child(3) a{
	width: 170px;
}
header nav ul li:first-child{
	border-left:1px solid #e6e6e6;
}

header nav ul li.nav-coating > ul{
	display: none;
	padding: 0;
	position: fixed;
	z-index: 100;
}
	header nav ul li.nav-coating > ul li{
		float: none;
		border-right:none;
		border-left:none;
		background:#001527;
		opacity: 0.9;
	}
	header nav ul li.nav-coating > ul li a{
		padding: 15px 0;
		border-bottom: 1px solid #fff;
		color:#fff;
	}
	header nav ul li.nav-coating > ul li a:hover{
		opacity: 0.5;
	}

header #menu { display: none;}
/*
header.current {
	position: fixed;
	width:100%;
	z-index:500;
	box-shadow: 0px 1px 2px #ccc;
}
header.current h1,
header.current .herader-logo,
header.current .header-contact,
header.current .sub-navi,
header.current .header-entry{
	display: none;
}
*/


.pc-menu .ul-first li{
	position:relative;
}
.pc-menu .ul-second{
	display: none;
	position:absolute;
	z-index:1000;
}
.pc-menu .ul-second.current{
	display: block;
}

.pc-menu .ul-second li{
	background:#fff;
}
.pc-menu .ul-second li a{
	text-decoration: none;
	box-sizing:border-box;
	padding:10px 0;
}

header nav ul li .ul-second li{
	border-right: none;
}
header nav ul li .ul-second li:first-child{
	border-left: none;
}
header nav ul li:nth-child(3) .ul-second li{
	width:170px;
}
.pc-menu .ul-second li a:hover{
	background:#002c52;
	color:#fff;
}


@media screen and (max-width:737px){
	header #menu {
		display: block;
	}
	header nav{
		display: none;
	}
	.herader-logo{
		height: 60px;
		display: table-cell;
		vertical-align: middle;
	}
	.herader-logo img{
		max-width: 50%;

	}
}


/* sp menu btn */

@media screen and (max-width:737px){
	header #menu{
		position: fixed;
		right:0;
		top:10px;
		z-index:9999;
		background:#c00000;
		color:#FFFFFF;
		font-size:0.76em;
		height:60px;
		overflow:hidden;
	}
	header #menu:before{
		content:"MENU";
		display:block;
		position:absolute;
		left:0;
		top:37px;
		width:60px;
		text-align: center;
		font-size:1.167em;
	}
	header #menu.close{
		background: url(/live/oe_/https://www.java-style.com/common/img/header_menu_bg02.png) center 40px no-repeat #31A9D8;
		background-size: auto 7px ;
	}
	header #menu a{
	  display: inline-block;
	  position: relative;
	  width: 60px;
	  height:60px;
	  overflow:hidden;
	}
	header #menu a span{
	  display: block;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  width: 24px;
	  height: 2px;
	  margin: -6px 0 0 -12px;
	  background: #FFF;
	  transition: .2s;
	  text-indent:-9999px;
	}
	header #menu a span:before, header #menu a span:after{
	  display: block;
	  content: "";
	  position: absolute;
	  top: 50%;
	  left: 0;
	  width: 24px;
	  height: 2px;
	  background: #FFF;
	  transition: .3s;
	}
	header #menu a span:before{
	  margin-top: -6px;
	}
	header #menu a span:after{
	  margin-top: 4px;
	}
	header #menu a .close{
	  background: transparent;
	}
	header #menu a .close:before, header #menu a .close:after{
	  margin-top: 0;
	}
	header #menu a .close:before{
	  transform: rotate(-45deg);
	  -webkit-transform: rotate(-45deg);
	}
	header #menu a .close:after{
	  transform: rotate(-135deg);
	  -webkit-transform: rotate(-135deg);
	}
}


/*** ------------------------------------------------------------------------------ 

visual

-----------------------------------------------------------------------------  ***/
#visual { height:300px; position: relative;}
#home #visual { height:100%;}
#home #visual .inner{
	width:auto;
	padding:0;
	text-align:center;
}
/*	#visual .inner{ padding:0;}*/
	#visual h2 {
		margin: 0;
		text-align: center;
		color: #fff;
		font-size: 46px;
		font-weight: bold;
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%;
		transform: translateY(-50%);
	}
	#visual .inner{
		padding: 0;
	}

@media screen and (max-width: 737px){	
	#main-content { margin: 0;}
	#visual {
		height: 150px;
		padding: 0;
	}
	#visual h2 {
		margin: 0 10px;
		font-size: 1.714em;
	}
	#cont .sp_none { display: none;}
}


/*** ------------------------------------------------------------------------------ 

footer

-----------------------------------------------------------------------------  ***/
footer{
	background:#002c52;
	color:#fff;
} 
footer .inner{ padding:25px 0 55px;}
footer .inner .box01L{
	width:520px;
	float:left;
}
	footer .inner .box01L .footer-logo{	margin-bottom:30px;}
	footer .inner .box01L ul.sp_none{
		width:150px;
		float:left;
		display: block;
	}
	footer .inner .box01L ul.sp_none:nth-of-type(3){
		width:210px;
	}
	footer .inner .box01L ul.sp_none li{
		text-indent: -20px;
		padding: 0 0 0 20px;
	}
	footer .inner .box01L ul.sp_none li a{
		background:url(/live/oe_/https://www.java-style.com/common/img/arrow02.png) no-repeat left 2px center;
		padding-left:20px;
	}
	footer .inner .box01L ul.sp_none li.out-link a{
		background:url(/live/oe_/https://www.java-style.com/common/img/out-link_w_pc.png) no-repeat left center;
	}	
	footer .inner .box01L ul.pc_none{ display: none;}
	
footer .inner .box01R{
	width:480px;
	float:right;
}
	footer .inner .box01R p a:hover{ opacity:0.7;}
	footer ul li a:link{ color:#fff;}
	footer ul li a:visited{ color:#fff;}

footer small{
	background:#fff;
	display: block;
	padding:8px 0;
	text-align:center;
	font-size:12px;
	color:#000;
}
	footer small a:link,
	footer small a:visited{
		text-decoration: none;
		color:#000;
	}

@media screen and (max-width: 737px){
	footer .inner{ padding:0;}
	footer .inner .box01L{
		width: auto;
		float: none;
	}
		footer .inner .box01L .footer-logo{
			text-align: center;
			padding:20px;
			margin-bottom:10px;
		}
		footer .inner .box01L .footer-logo img{	max-width: 100%;}
		footer .inner .box01L ul.sp_none{display: none;}
		footer .inner .box01L ul.pc_none{
			display: block;
			width: 100%;
		}
		footer .inner .box01L ul.pc_none li a{
			background: url(/live/oe_/https://www.java-style.com/common/img/arrow02.png) no-repeat left 15px center;
			border-top: 1px solid #fff;
			padding: 12px 20px 12px 35px;
			display: block;
			text-decoration: none;
		}
		footer .inner .box01L ul.pc_none li.out-link a{
			background:url(/live/oe_/https://www.java-style.com/common/img/out-link_w_sp.png) no-repeat left 10px center;
			background-size:15px;
		}
	footer .inner .box01R{
		width: auto;
		float: none;
		display: none;
	}
	footer .inner .ccnetwork{
		background: #fff;
		text-align: center;
		padding: 10px 0;
	}
}

/*** ------------------------------------------------------------------------------ 

sp-navi

-----------------------------------------------------------------------------  ***/
#sp_navi{ display: none;}

@media screen and (max-width:737px){
	#left-content{
		width: 100%;
		position: relative;
		padding: 80px 0 0 0;
	}
	#left-content.current{
		overflow: hidden;
	/*	position: fixed;*/
	}
	#sp_navi{
		width: 100%;
		height: 100%;
		background:#fff;
		display: block;
		position: fixed;
		top: 80px;
		right: -100%;
	}
	#sp_navi.current{ display: block;}
	#sp_navi nav{ overflow-y: scroll;}
	#sp_navi li { border-bottom: 1px solid #bbb;}
	#sp_navi li a{
		width: 70%;
		display: block;
		padding: 10px;
		box-sizing: border-box;
		text-decoration: none;
		background: url(/live/oe_/https://www.java-style.com/common/img/arroiw02.png) no-repeat right 10px center;
	}
	#sp_navi li.out-link a{
		background: url(/live/oe_/https://www.java-style.com/common/img/out-link_sp.png) no-repeat right 0 center;
		background-size:15px;
	}
	#sp_navi li.nav-service{
		background: #fdd100;
		padding-left:15px;
		box-sizing:border-box;
		border-bottom: none;
	}
	#sp_navi li.nav-service a{
		width: 70%;
		display: block;
		padding: 10px 0 10px 10px;
		box-sizing: border-box;
		border-bottom: 1px solid #fff;
		text-decoration: none;
		background: url(/live/oe_/https://www.java-style.com/common/img/arroiw02_under.png) no-repeat right 10px center #fdd100;
	}
	#sp_navi li.no-line a{ border-bottom: none;}
	#sp_navi p {text-align: center;}
	#sp_navi p a{
		background: #ede7e7;
		width:64%;
		margin: 10px 3%;
		padding: 10px;
		box-sizing: border-box;
		border-radius: 6px;
		display: block;
		border: 1px solid #bbb;
		text-decoration: none;
	}
}


/*** ------------------------------------------------------------------------------ 

#side-bnr サイドバナー

-----------------------------------------------------------------------------  ***/
/* ふわふわ動くタグ名：side-bnr */
#side-bnr-request{
	position:fixed;
	top:150px;
	right:0;
	z-index:999;
}
#side-bnr-request a:hover{
	opacity:0.7;
}
@media screen and (max-width:737px){
	#side-bnr-request{
		display: none;
	}	
}

/*　190822採用バナー追加　*/

#side-recruit{
	position:fixed;
	top:450px;
	right:0;
	z-index:999;
}
#side-recruit a:hover{
	opacity:0.7;
}

@media screen and (max-width:737px){
	#side-recruit{
		display: none;
	}	
}

/*** ------------------------------------------------------------------------------ 

#topic-pass (パンくず)

-----------------------------------------------------------------------------  ***/
#cont .topic_box { background-color: #EFEFEF;}
	#cont #topic-pass {
		width: 1000px;
		margin: 0 auto;
		padding: 14px 0;
	}
	#cont #topic-pass li { float: left;}
	#cont #topic-pass li img { vertical-align: top;}
	#cont #topic-pass li span {
		padding: 0 14px;
		display: inline-block;
	}
	#cont #topic-pass li a { text-decoration: none;}
	#cont #topic-pass li a:hover { text-decoration: underline;}
	#cont #topic-pass li a:hover img { opacity: 0.8;}

	#cont #topic-pass li br{
		display: none;
	}

@media screen and (max-width: 737px){
	#cont .topic_box { display: none;}
		#cont #topic-pass {
			width: auto;
			padding: 10px;
		}
}


/*** ------------------------------------------------------------------------------ 

#form-btn (フォームボタン)

-----------------------------------------------------------------------------  ***/
/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}

#form-btn {
    text-align: center;
    padding:10px 0 0;
}
	#form-btn li{
		display:inline-block;
		margin:0 5px 10px;
	}
	#form-btn input[type="submit"],
	#form-btn input[type="button"],
	#form-btn input[type="reset"] {
		width: 200px;
		padding: 15px 0;
		background: #d61a00;
		border: none;
		text-align: center;
		color: #FFF;
		font-size: 1.333em;
		font-weight: bold;
		outline: none;
		cursor: pointer;
		border-radius:35px;
	}
	#form-btn input[type="submit"]:hover{ opacity:0.7;}
	#form-btn input[type="reset"] {
		background: #606060;
		color:#fff;
	}
	#form-btn input[type="reset"]:hover { opacity:0.7;}
	#form-btn input[type="button"] {
		background: #CCC;
		color:#333;
	}
	#form-btn input[type="button"]:hover { background: #999;}
	

/*** ------------------------------------------------------------------------------ 

.youtube (YouTubeレスポンシブ化)

-----------------------------------------------------------------------------  ***/
@media screen and (max-width: 737px){
	.youtube {
		position: relative;
		padding-bottom: 56.25%;
		padding-top: 30px;
		height: 0;
		overflow: hidden;
		margin-top: 20px;
		margin-bottom: 20px;
	}
		.youtube iframe {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			border: none;
		}
}

/*** ------------------------------------------------------------------------------ 

.google-maps (Google Mapレスポンシブ化)

-----------------------------------------------------------------------------  ***/
#map_canvas{
     width: 100%;
     height: 320px;
     margin: 0 auto;
	 position:relative;
}
@media screen and (max-width: 737px){
 #map_canvas{
      width: 100%;
	  height: 200px;
  }
}


@media screen and (max-width: 737px){
.google-maps {
position: relative;
padding-bottom: 75%; // これが縦横比
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
}



/*** ------------------------------------------------------------------------------ 

.paginations (ページング)

-----------------------------------------------------------------------------  ***/
.paginations{
  list-style-type: none;
  padding-left: 0;
  margin: 30px 0;
}
 
.paginations,
.paginations li a {
	/* flex */
	display:-webkit-box;
    display:-ms-flexbox;
    display: -webkit-flex;
    display:flex;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    -webkit-justify-content:space-between;
    justify-content:space-between;
	-webkit-display: flex;
	
  flex-wrap: wrap;
  -webkit-justify-content: center;
  justify-content: center;
  text-align:center;
  
  -webkit-box-align:center;
  -ms-flex-align:center;
  -webkit-align-items:center;
  align-items:center;
}
 
.paginations a {
  font-weight: 300;
  padding-top: 1px;
  text-decoration:none;
  border: 1px solid #ddd;
  border-left-width: 0;
  min-width:36px;
  min-height:36px;
  color: #333;
  text-align:center;
}
 
.paginations li:not([class*="current"]) a:hover {
  background-color: #eee;
}
 
.paginations li:first-of-type a {
  border-left-width: 1px;
}
 
.paginations li.first span,
.paginations li.last span,
.paginations li.previous span,
.paginations li.next span {
  /* screen readers only */
  position: absolute;
  top: -9999px;
  left: -9999px;
}
 
.paginations li.first a::before,
.paginations li.last a::after,
.paginations li.previous a::before,
.paginations li.next a::after {
  display: inline-block;
  font-family: Fontawesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
 
.paginations li.first a::before { content: "\f100"; }
.paginations li.last a::after { content: "\f101"; }
 
.paginations li.previous a::before { content: "\f104"; }
.paginations li.next a::after { content: "\f105"; }
 
.paginations li.current a {
 background-color: #ddd;
 cursor: default;
 pointer-events: none;
}
 
.paginations > li:first-child > a {
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
}
 
.paginations > li:last-child > a {
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
}
 
@media only screen and ( max-width: 680px ) {
  .paginations li.first,
  .paginations li.last {
    /* screen readers only */
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
 
  .paginations li.previous a { border-left-width: 1px; }
}
 
@media only screen and ( max-width: 500px ) {
  .paginations li {
    /* screen readers only */
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
 
  .paginations li.current,
  .paginations li.first,
  .paginations li.last,
  .paginations li.previous,
  .paginations li.next{
    position: initial;
    top: initial;
    left: initial;
  }
 
  .paginations li.previous a { border-left-width: 0; }
}
@media only screen and ( max-width: 400px ) {
  .paginations li.first,
  .paginations li.last {
    /* screen readers only */
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
 
  .paginations li.previous a { border-left-width: 1px; }
}
@media only screen and ( max-width: 240px ) { /* For watches? */
  .paginations li { width: 50%;}
 
  .paginations li.current {
    order: 2;
    width: 100%;
    border-left-width: 1px;
  }
}


/*** ------------------------------------------------------------------------------ 

.fixedbanner_sp (スマホ追尾バナー)

-----------------------------------------------------------------------------  ***/

.fixedbanner_sp{display: none;}


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

.fixedbanner_sp{
	overflow: hidden;
    box-sizing: border-box;
    display: block;	
	width: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 1001;
}
.fixedbanner_sp li{
	float:left;
	width: 50%;
}
.fixedbanner_sp li:nth-child(2){
	float:right;
}
.fixedbanner_sp li img{
	width: 100%;
	height: auto;
}	
}

@media screen and (min-width: 769px){
	#fix-anker{
		display: none;
	}
}



/*** ------------------------------------------------------------------------------ 

    page-404（404ページ）

-----------------------------------------------------------------------------  ***/
#page-404 #visual{
    background: url(/live/oe_/https://www.java-style.com/imgs/shop/kobenishi/visual.jpg?ver=240705) center center no-repeat #F2F2F2;
    background-size: cover;
	display: block;
}

#page-404 .section-404{
    padding: 40px 0;
}
#page-404 .section-404 .section-404__txt{
    text-align: center;
    font-size: 18px;
    margin: 0 0 2.0em;
    line-height: 2.0;
}
@media screen and (max-width: 768px){
    #page-404 #visual h2{
        padding: 35px 0 0;
    }
    #page-404 .section-404 .section-404__txt{
        text-align: left;
        font-size: 16px;
        padding: 0 20px;
    }
}