/**********************
　　トップページ/index.html
**********************/

#top_fla_area {
  display:none;
}

.top_main_sp{
  margin: 58px 0 0;
}

.top_main_sp img{
  width:100%;
}

.top_main_sp .bx-wrapper li.clickArea {
    position: relative;
}
.top_main_sp .bx-wrapper li.clickArea .area {
    position: absolute;
    bottom: calc((90 / 900) * 100vw);
    display: block;
    width: calc((200 / 900) * 100vw);
    height: calc((112 / 900) * 100vw);
}
.top_main_sp .bx-wrapper li.clickArea .area:hover {
    background-color: #fff;
    opacity: .3;
}
.top_main_sp .bx-wrapper li.clickArea .area1 {
    left: calc((111 / 900) * 100vw);
}
.top_main_sp .bx-wrapper li.clickArea .area2 {
    left: calc((328 / 900) * 100vw);
}
.top_main_sp .bx-wrapper li.clickArea .area3 {
    bottom: calc((59 / 900) * 100vw);
    right: calc((95 / 900) * 100vw);
    width: calc((177 / 900) * 100vw);
    height: calc((51 / 900) * 100vw);
}

div.news {
	margin: 0 0 20px ;
	padding: 0 0 65px;
	width: auto;
  position:relative;
  border:3px solid #d5d5d5;
}

div.news_title {
	margin: 0px;
	padding: 0px;
	width: auto;
	background: none;
	border: none;
}

div.news_title p.news {
  display:none;
}

div.news_title p.news_more {
	margin:0 15%;
	padding: 0px;
  position:absolute;
  bottom: 10px;
  left:0;
  right:0;
}

/**詳細は各font.cssへ**/

div.news dl {
	width: auto;
    margin: 0;
  padding: 0 10px;
}

div.news dl dt {
	margin: 0px;
	padding: 10px 3px 0px;
	width: auto;
}

div.news dl dd {
	margin: 0px;
	padding: 5px 3px 11px;
	width: auto;
	background: url(/common/images/contents_line.gif) bottom left no-repeat;
}

html>body div.news dl dd {
	padding: 4px 0 8px;
  width:auto;
}

div.news dl dd p span {
	padding-right: 8px;
}

div.news dl dd p span img {
	vertical-align: text-top !important;
}

div.feed {
	margin: 0 0 20px;
	padding: 0 10px 65px;
	width: auto;
  position:relative;
  border:3px solid #d5d5d5;
}

div.feed #notice_feed_load {
	 margin: 15px 0;
	 text-align: center;
}

div.feed_title {
	margin: 0px;
	padding: 0;
	width: auto;
	background: none;
	border: none;	
} 

div.feed_title p.feed {
  display:none;
}

div.feed_title p.feed_more {
	margin:0 15%;
	padding: 0px;
  position:absolute;
  bottom: 10px;
  left:0;
  right:0;
}

div.feed dl {
	margin: 0;
	width: auto;
}

div.feed dl dt {
	margin: 0px;
	padding: 10px 3px 0px;
	width: auto;
}

div.feed dl dd {
	margin: 0px;
	padding: 5px 3px 11px;
	width: auto;
	background: url(/common/images/contents_line.gif) bottom left no-repeat;

}

html>body div.feed dl dd {
	padding: 4px 3px 8px;
}

div.banner_area {
  display:none;
}

ul.foot_bana {
  display:none;
}


div.pickup_area {
  display:none;
}

.top_menu_sp{
  width:100%;
  margin: 0 0 20px
}

.top_menu_sp img{
  width:100%;
  margin: 0 0 5px;
  display:block;
}

.top_menu_sp .bnr_space{
  padding: 20px 10px;
}

.pickup_sp .pickup_sp_ttl{
  font-weight:bold;
  background:#ececec;
  padding: 15px 10px;
  border-top:1px solid #d5d5d5;
  border-bottom:1px solid #d5d5d5;
}

.pickup_sp ul{
  padding: 0 10px;
}

.pickup_sp ul li{
  padding: 10px 0;
  border-bottom:dotted 1px #bbbbbb;
}

.pickup_sp ul li dl{
  display:table;
}

.pickup_sp ul li dl dt{
  display:table-cell;
  width:25%;
}

.pickup_sp ul li dl dt img{
  width:100%;
}

.pickup_sp ul li dl dd{
  display:table-cell;
  vertical-align:middle;
  padding: 0 0 0 10px;
  line-height:1.4;
}






/* image replacement */

#conatainer {
border:solid 1px;
}

#container2, #container3{
	margin:0 0 2em;
	position:relative;
	text-align:left;
	background:#fff;
	border:solid 1px #d5d5d5;
}

#container2{
	width:309px;
}

#container3{
	width:153px;
}

#content2, #content3, .jcarousel-container {
	position:relative;
}

.jcarousel-skin-tango2 .jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-skin-tango2 .jcarousel-list li,
.jcarousel-skin-tango2 .jcarousel-item {
    float: left;
    list-style: none;
    width: 285px;
    height: 37px;
    margin: 10px 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    width: 133px;
    height: 45px;
}

.jcarousel-skin-tango2 .jcarousel-item img {
    width:285px;
}

.jcarousel-next, .jcarousel-prev {
    z-index: 3;
    display: none;
}

.jcarousel-skin-tango .jcarousel-container, .jcarousel-skin-tango2 .jcarousel-container {
    -moz-border-radius: 10px;
}

.jcarousel-skin-tango2 .jcarousel-container-vertical {
    width: 285px;
    height: 152px;
    padding: 10px 10px;
}

html>body .jcarousel-skin-tango2 .jcarousel-container-vertical {
    height: 158px;
}

.jcarousel-skin-tango2 .jcarousel-clip-vertical {
	padding: 15px 0 0;
    width:  285px;
    height: 145px;
}

html>body .jcarousel-skin-tango2 .jcarousel-clip-vertical {
	padding:0;
	margin: 10px 0;
    height: 145px;
}

.jcarousel-skin-tango2 .jcarousel-item {
	margin:5px 0 0;
    width: 285px;
    height: 50px;
}

html>body .jcarousel-skin-tango2 .jcarousel-item {
	margin:15px 0;
}

.jcarousel-skin-tango .jcarousel-item-vertical, .jcarousel-skin-tango2 .jcarousel-item-vertical {
    margin-bottom: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder, .jcarousel-skin-tango2 .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

.jcarousel-skin-tango2 .jcarousel-next-vertical {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 309px;
    height: 19px;
    cursor: pointer;
    background: transparent url("/images/corp/btn_next.gif") no-repeat 0 0;
}

.jcarousel-skin-tango2 .jcarousel-prev-vertical {
    position: absolute;
    top: 0;
    left: 0;
    width: 309px;
    height: 19px;
    cursor: pointer;
    background: transparent url("/images/corp/btn_prev.gif") no-repeat 0 0;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 133px;
    height: 199px;
	/*height: 259px;*/
    padding: 23px 10px 0;
}

html>body .jcarousel-skin-tango .jcarousel-container-vertical {
	width: 135px;
	padding: 10px;
	height: 200px;
	/*height: 260px;*/
}

.jcarousel-skin-tango .jcarousel-clip-vertical {
	padding: 10px 0 0;
	margin: 10px 0;
    width:  133px;
    height: 160px;
    /*height: 220px;*/
}

html>body .jcarousel-skin-tango .jcarousel-clip-vertical {
	padding: 0;
	height: 170px;
    /*height: 230px;*/
}

.jcarousel-skin-tango .jcarousel-item {
	margin:0 0 12px;
    width: 75px;
    height: 39px;
}

html>body .jcarousel-skin-tango .jcarousel-item {
	margin:10px 0;
	height: 38px;
}

.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 153px;
    height: 19px;
    cursor: pointer;
    background: transparent url("/images/pickup/btn_next.gif") no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 0;
    left: 0;
    width: 153px;
    height: 19px;
    cursor: pointer;
    background: transparent url("/images/pickup/btn_prev.gif") no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active,
.jcarousel-skin-tango2 .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango2 .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango2 .jcarousel-next-disabled-vertical:active,
.jcarousel-skin-tango2 .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango2 .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango2 .jcarousel-prev-disabled-vertical:active {
    cursor: default;
}

/*  2016.04.25  */

.message_area{
	margin-bottom: 20px;
    padding: 20px;
    border: solid 1px #999999;
	text-align:center;
	font-weight: bold;
}
.message_area p{
    font-weight: bold;
    line-height: 1.5;
}
.message_area .txt_link{
	margin-top:17px;
}


/*  2018.02.12 まえだくんアニメーション  */

#wrapper{
  overflow: hidden;
}


#character01,
#character01-02{
	margin: 250px 0 0 -150px;
	position: absolute;
	animation: moveY02 2s infinite alternate ease-in, moveX 11s infinite normal linear;
	-ms-animation: moveY02 2s infinite alternate ease-in, moveX 11s infinite normal linear;
	-webkit-animation: moveY02 2s infinite alternate ease-in, moveX 11s infinite normal linear;
	-moz-animation: moveY02 2s infinite alternate ease-in, moveX 11s infinite normal linear;
	-webkit-animation-delay: 2s;
  z-index: 10000;
}

#character01-02{
	margin: 2200px 0 0 -150px;
}

#character03 {
	margin: 1600px -130px 0 0;
	position: absolute;
	animation: moveY02 2s infinite alternate linear, moveX03 11s infinite normal linear;
	-ms-animation: moveY02 2s infinite alternate linear, moveX03 11s infinite normal linear;
	-webkit-animation: moveY02 2s infinite alternate linear, moveX03 11s infinite normal linear;
	-moz-animation: moveY02 2s infinite alternate linear, moveX03 11s infinite normal linear;
  z-index: 10000;
}


#character04,
#character04-02{
	margin: 900px 0 0 -130px;
	position: absolute;
	animation: moveY 2s infinite alternate ease-in, moveX04 7s infinite normal linear;
	-ms-animation: moveY 2s infinite alternate ease-in, moveX04 7s infinite normal linear;
	-webkit-animation: moveY 2s infinite alternate ease-in, moveX04 7s infinite normal linear;
	-moz-animation: moveY 2s infinite alternate ease-in, moveX04 7s infinite normal linear;
	-webkit-animation-delay: 2s;
  z-index: 10000;
}

#character04-02{
	margin: 2800px 0 0 -130px;
}

#character01 img, #character01-02 img{width: 65px;}
#character03 img{width: 80px;}
#character04 img, #character04-02 img{width: 80px;}


@keyframes moveY {
0% {top:0px;}
50% {	top:30px;}
100% {top:0px;}
}

@-ms-keyframes moveY {
0% {top:0px;}
50% {	top:15px;}
100% {top:0px;}
}

@-webkit-keyframes moveY /* Safari and Chrome */
{
0% {top:0px;}
50% {	top:15px;}
100% {top:0px;}
}

@-moz-keyframes moveY /* Firefox */
{
0% {top:0px;}
50% {	top:15px;}
100% {top:0px;}
}

@keyframes moveY02 {
0% {top:0px;}
50% {	top:15px;}
100% {top:0px;}
}

@-ms-keyframes moveY02 {
0% {top:0px;}
50% {	top:10px;}
100% {top:0px;}
}

@-webkit-keyframes moveY02 /* Safari and Chrome */
{
0% {top:0px;}
50% {	top:10px;}
100% {top:0px;}
}

@-moz-keyframes moveY02 /* Firefox */
{
0% {top:0px;}
50% {	top:10px;}
100% {top:0px;}
}

/*　横の動き　*/
@keyframes moveX {
0% {left:-150px;}
100% {left:150%;}
}
@-ms-keyframes moveX{
0% {left:150px;}
100% {left:150%;}
}
@-webkit-keyframes moveX /* Safari and Chrome */
{
0% {left:150px;}
100% {left:150%;}
}
@-moz-keyframes moveX /* Firefox */
{
0% {left:0px;}
100% {left:150%;}
}


@keyframes moveX03 {
0% {right:-300px;}
100% {right:150%;}
}
@-ms-keyframes moveX03{
0% {right:-300px;}
100% {right:150%;}
}
@-webkit-keyframes moveX03 /* Safari and Chrome */
{
0% {right:-300px;}
100% {right:150%;}
}
@-moz-keyframes moveX03 /* Firefox */
{
0% {right:-300px;}
100% {right:150%;}
}



@keyframes moveX04 {
0% {right:-300px;}
100% {right:120%;}
}
@-ms-keyframes moveX04{
0% {right:-300px;}
100% {right:120%;}
}
@-webkit-keyframes moveX04 /* Safari and Chrome */
{
0% {right:-300px;}
100% {right:120%;}
}
@-moz-keyframes moveX04 /* Firefox */
{
0% {right:-300px;}
100% {right:120%;}
}