@charset "utf-8";
/*----------------------------------------------------------
    RESET
----------------------------------------------------------*/
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{text-decoration:none}ins,mark{background-color:#ff9;color:#000}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}


/**
 * BxSlider v4.0 - Fully loaded, responsive content slider
 * http://bxslider.com
 *
 * Written by: Steven Wanderski, 2012
 * http://stevenwanderski.com
 * (while drinking Belgian ales and listening to jazz)
 *
 * CEO and founder of bxCreative, LTD
 * http://bxcreative.com
 */
/** RESET AND LAYOUT
===================================*/
.bx-wrapper{position:relative;padding:0;*zoom:1}.bx-wrapper img{max-width:100%;display:block}.bx-wrapper .bx-viewport{background-color:transparent}.bx-wrapper .bx-controls-auto,.bx-wrapper .bx-pager{position:absolute;bottom:30px;width:100%;z-index:99}.bx-wrapper .bx-loading{min-height:50px;background:url(images/bx_loader.gif)center center no-repeat #fff;height:100%;width:100%;position:absolute;top:0;left:0;z-index:2000}.bx-wrapper .bx-pager{text-align:center;font-size:.85em;font-family:Arial;font-weight:700;color:#666}.bx-wrapper .bx-controls-auto .bx-controls-auto-item,.bx-wrapper .bx-pager .bx-pager-item{display:inline-block;*zoom:1;*display:inline}.bx-wrapper .bx-pager.bx-default-pager a{background:#666;text-indent:-9999px;display:block;width:10px;height:10px;margin:0 5px;outline:0;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}.bx-wrapper .bx-pager.bx-default-pager a.active,.bx-wrapper .bx-pager.bx-default-pager a:hover{background:#000}.bx-wrapper .bx-prev{left:-20px;background:url(images/controls.png)no-repeat 0 -2pc}.bx-wrapper .bx-next{right:-20px;background:url(images/controls.png)no-repeat -43px -2pc}.bx-wrapper .bx-prev:hover{background-position:0 0}.bx-wrapper .bx-next:hover{background-position:-43px 0}.bx-wrapper .bx-controls-direction a{position:absolute;top:50%;margin-top:-1pc;outline:0;width:2pc;height:2pc;text-indent:-9999px;z-index:9999}.bx-wrapper .bx-controls-direction a.disabled{display:none}.bx-wrapper .bx-controls-auto{text-align:center}.bx-wrapper .bx-controls-auto .bx-start{display:block;text-indent:-9999px;width:10px;height:11px;outline:0;background:url(images/controls.png)-86px -11px no-repeat;margin:0 3px}.bx-wrapper .bx-controls-auto .bx-start.active,.bx-wrapper .bx-controls-auto .bx-start:hover{background-position:-86px 0}.bx-wrapper .bx-controls-auto .bx-stop{display:block;text-indent:-9999px;width:9px;height:11px;outline:0;background:url(images/controls.png)-86px -44px no-repeat;margin:0 3px}.bx-wrapper .bx-controls-auto .bx-stop.active,.bx-wrapper .bx-controls-auto .bx-stop:hover{background-position:-86px -33px}.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager{text-align:left;width:80%}.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto{right:0;width:35px}.bx-wrapper .bx-caption{position:absolute;bottom:0;left:0;background:#666\9;background:rgba(80,80,80,.75);width:100%}.bx-wrapper .bx-caption span{color:#fff;font-family:Arial;display:block;font-size:.85em;padding:10px}

/*----------------------------------------------------------
    bxSlider Custom
----------------------------------------------------------*/
.bx-wrapper img { max-width: 100%; display: inline!important;}
.sliderArea { position: relative;}
/*  default control */
.sliderArea .bx-wrapper .bx-controls-direction a { text-indent: 0; margin-top: -20px; width: 40px; height: auto; background: none;}
.sliderArea .bx-wrapper .bx-prev { left: -40px;}
.sliderArea .bx-wrapper .bx-next { right: -40px;}
/* default pager */
.sliderArea .bx-wrapper .bx-pager { bottom: 0px;}
.sliderArea .bx-wrapper .bx-pager.bx-default-pager a { background-color: #868686; margin: 0 15px; height: 16px; width: 16px; border-radius: 8px;}
.sliderArea .bx-wrapper .bx-pager.bx-default-pager a:hover, .sliderArea .bx-wrapper .bx-pager.bx-default-pager a.active { background-color: #ff9900;}
/* custom pager */
.sliderArea .pager { overflow: hidden;}
.sliderArea .pager a { color: #333; float: left; display: block; position: relative;}

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

float解除用 clear

=================================================== */
.clear { clear: both }
br.clear { font-size: 1px; line-height: 100%; clear: both; }
div.clear { line-height: 100%; clear: both; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/*IE*/
.clearfix { zoom: 1 }

/* hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/* imgfix set */
.imgfix { font-size: 1px; line-height: 1px; }

/*----------------------------------------------------------
    font
----------------------------------------------------------*/
body { font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "メイリオ", 'Meiryo', "ＭＳ Ｐゴシック", 'MS PGothic', Helvetica, Arial, sans-serif; font-size: 14px; *font-size: small; /* IE7およびIE6標準準拠モード用 */ *font: x-small; /* IE6後方互換モード用 */ letter-spacing: 0px; -webkit-text-size-adjust: none; /* iPhone用フォント自動リサイズ防止 */ }
table { font-size: inherit; font: 100%; }
pre, code, kbd, samp, tt { font-family: monospace; *font-size: 100%; font: 115% monospace; line-height: 150%; }
h1,h2,h3,h4,h5,h6 { font-weight:normal;}

/*----------------------------------------------------------
    font Color
----------------------------------------------------------*/
body { color:#333333;}
a { color:#cc5176; text-decoration:underline;}
a:hover { text-decoration:none;}
a:focus { outline:none;}

/*----------------------------------------------------------
    General
----------------------------------------------------------*/
body { min-width: 1100px; _display: inline; _zoom: 1 }
p, div { background: url(../img/blank.png) }
* { box-sizing: border-box }
img { vertical-align: bottom }
ul, ol { list-style: none }
p { line-height: 1.6666 }
.tar { text-align: right !important }
.tac { text-align: center !important }
.tal { text-align: left !important }
.justify { text-align: justify; text-justify: distribute }
.table { display: table }
.table > * { display: table-cell }
.cell { display: table-cell }
.ov:hover { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; -moz-opacity: 0.7; -khtml-opacity: 0.7 }
.anchor { margin-top: -75px; padding-top: 75px }

/*----------------------------------------------------------
    layout
----------------------------------------------------------*/
    body { min-width: 100%; word-break: break-all; }
    img { max-width: 100%; height: auto; }
    .inner { width: auto; margin: 0; }
#wrapper { position:relative; overflow-x: hidden;}

/*----------------------------------------------------------
    Mediaquary Tablet
----------------------------------------------------------*/
@media only screen and (min-width : 768px) and (max-width : 959px) {
    body { min-width: 100%; word-break: break-all; }
    img { max-width: 100%; height: auto; }
    .inner { width: auto; margin: 0; }
}
/*----------------------------------------------------------
    Mediaquary Mobile(Landscape)
----------------------------------------------------------*/
@media only screen and (min-width:0px) and (max-width:767px) {
    body { min-width: 100%; word-break: break-all; }
    img { max-width: 100%; height: auto; }
    .inner { width: auto; margin: 0; }
}

/*----------------------------------------------------------
    Common
----------------------------------------------------------*/
body { background-color: #fff; }
#footer { background-color: #666666; padding: 30px; text-align: center; }
.pcHide { display: none; }
@media only screen and (min-width:0px) and (max-width:767px) {
    .pcHide { display: inline; }
    .spHide { display: none; }
}

/*----------------------------------------------------------
    Container
----------------------------------------------------------*/
#kv { background: url(../img/kv_bg02.jpg) no-repeat 50% 0; height: 870px; color: #fff; }
.kv_logo { text-align: center; padding: 60px 0 57px; }
.kv_title { text-align: center; }
.kv_title-1 { display: block; margin: 0 auto 20px; }
.kv_SPcopy { display: none; }
.kv_logos { margin-top: 100px; }
@media only screen and (min-width:0px) and (max-width:767px) {
    #kv { height: auto; background: none; }
    .kv_logo { padding: 20px 0 0; width: 100%; position: absolute; left: 0; top: 0; }
    .logoImg { width: 73px; }
    .kv_title { padding: 0 10px; width: 100%; position: absolute; left: 0; top: 60px; }
    .kv_SPcopy { font-size: 1.4rem; color: #01055f; text-align: center; display: block; width: 100%; position: absolute; left: 0; top: 17rem; }
    .kv_logos { display: none; }
    .kvImg { width: 100%; }
}

.headline_2 { position: relative; text-align: center;}
.headline_2:before { border-bottom: 1px solid #7a7a7a; width: 130px; bottom: -30px; left: 50%; margin-left: -65px; position: absolute; content: ''; display: block;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
.headline_2:before { width: 65px; bottom: -15px; margin-left: -32px;}
}

#threefield { background: url(../img/threefield_bg.jpg) repeat 50% 0; height: auto; }
#threefield .threefield_block { overflow: hidden; width:980px; }
#threefield li { width: 320px; float: left; background-color: #fff; border: 1px solid #fff;}
#threefield li + li { margin-left: 10px;}
#threefield .s1 { background-color: #f4fbfe;}
#threefield .s2 { background-color: #f9f9f8;}
#threefield .s3 { background-color: #f2fcfd;}
#threefield .head { text-align: center; padding: 18px 0 15px; border-bottom: 1px solid #313131;}
#threefield .body { padding: 0 19px 0;}
#threefield .body .threefield_h3 { text-align: center; margin: 40px 0 0;}
#threefield .body .copy { font-size: 16px; line-height: 1.25; margin-top: 40px; height: 130px;}
#threefield .body .logo { margin-bottom: 20px;}
#threefield .body .btn { text-align: center;}
#threefield .inner { padding: 60px 0;}
#threefield .inner h2 { text-align: center; margin-bottom: 56px;}
.detail_btn { background-color: #ff587e; display: inline-block; border-radius: 4px; padding: 10px 30px; width: 280px; text-align: right;}
.threefield_detailBtn { width: 160px;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
#threefield { height: auto; -webkit-background-size: cover; background-size: cover;}
#threefield .inner { padding: 20px 0;}
#threefield .inner h2 { margin-bottom: 20px; padding: 0 10px;}
#threefield .threefield_block { padding: 0 10px; width: auto;}
#threefield li { width: 100%; float: none; margin-bottom: 10px;}
#threefield li + li { margin-left: 0;}
#threefield .s3 { background-color: #F3F5FA;}
#threefield .body { padding: 10px;}
#threefield .body .threefield_h3 { text-align: center; margin: 0 auto; width: 220px;}
#threefield .body .copy { font-size: 16px; margin-top: 10px; height: auto; line-height:1.6;}
#threefield .body .logo { text-align: center; margin: 0 auto; width: 220px;}
#threefield .photo { display: none;}
}


#concept .inner { padding: 60px 0 130px;}
#concept .inner .headline_2 { margin-bottom: 116px;}
#concept .body { position: relative;}
#concept .body .copy { font-size: 16px; line-height: 1.25;}
#concept .body .copy + .copy { margin-top: 1em;}
#concept .body .head { margin: 30px 0 50px;}
#concept .image { right: -40px; top: 79px; position: absolute;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
#concept .inner { padding: 30px 10px 30px;}
#concept .inner .headline_2 { margin-bottom: 50px;}
#concept .inner .headline_2 img { width: 120px;}
#concept .body { text-align: center;}
#concept .body .copy { text-align: left;}
#concept .body .copy br { display: none;}
#concept .body .head { margin: 0 0 40px; text-align: center;}
#concept .image { position: static; width: 235px; display: block; margin: 15px auto;}
}


.outline { padding-bottom: 100px;}
.outline .head { margin-bottom: 60px; height: 108px; line-height: 108px; text-align: center;}
.outline .head .logo { vertical-align: middle;}
.outline .headline_2 { margin-bottom: 60px;}
.outline .catch { padding: 35px 0 30px; width: 1100px; margin: 0 auto; text-align: center;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+50,0+100 */
background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
}
.outline .body { text-align: center; margin: 30px auto 0; padding-bottom: 60px; position: relative; width: 980px;}
.outline .body .copy_about { font-size: 16px; line-height: 1.5;}
.outline .body .head_about { margin-bottom: 25px;}
.outline .body .image { right: -66px; bottom: 0; position: absolute;}
.outline .feature { width: 1100px; margin: 0 auto;}
.outline .feature li { border: 1px solid #aaa; background-color: #fff; position: relative; margin-bottom: 10px;}
.outline .feature li p { font-size: 20px;}
.outline .feature li strong { font-weight: bold;}
.outline .feature .image { position: absolute;}
.outline .feature .ico { display: inline-block; margin-bottom: 24px;}
.outline .feature .feat_head { font-size: 36px; position: relative; margin: -38px 0 30px; z-index: 1;}
.outline .feature .feat_head span { display: block; line-height: 1.2; clear: both;}
.outline .btnBlock { text-align: center; margin-top: 50px;}
.outline .btnBlock .btn { display: inline-block; background-color: #666; padding: 24px 45px 24px; text-align: center; width: 720px; border-radius: 10px; box-shadow: inset 0 -7px 0 #333;}
.outline .btnBlock .btn span { display: block; background: url(../img/outline_btnarrow.png) no-repeat 100% 0; height: 32px;}
.outline .feature_title01 { font-size:34px;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
.outline { padding-bottom: 35px;}
.outline .headline_2 { margin-bottom: 35px;}
.outline .head { margin-bottom: 20px; line-height: 65px; height: 65px;}
.outline .catch { padding: 18px 0 15px; width: 100%; margin: 0 auto; text-align: center;}
.outline .body { margin: 30px auto 80px; padding-bottom: 0; position: relative; width: 100%;}
.outline .body .copy_about { font-size: 1.3rem; line-height: 1.38; padding: 0 10px; text-align: left;}
.outline .body .image { display: none;}
.outline .feature { width: 100%; margin: 0 auto; padding: 0 10px;}
.outline .feature li { margin: 50px 0 0;}
.outline .feature li p { font-size: 1.5rem;}
.outline .feature .ico { width: 75px; margin-bottom: 14px;}
.outline .feature .feat_head { font-size: 1.6rem; margin-bottom: 10px; letter-spacing: 0;}
.outline .btnBlock { margin-top: 10px; padding: 0 20px; line-height: 1;}
.outline .btnBlock .btn { width: auto; display: block; padding: 12px 15px;}
.outline .btnBlock .btn span { -webkit-background-size: auto 16px; background-size: auto 16px; background-position: 100% 50%; height: auto; padding: 0 40px;}
.outline .btnBlock .btn span img { vertical-align: top;}
}


#field01 { background: #f4fff8 url(../img/outline_field01_bg.jpg) no-repeat 50% 108px;}
#field01 .head { background:  url(../img/outline_field01_titlebg.jpg) no-repeat 50% 0;}
#field01 li { border-color: #14a68c;}
#field01 .feat_head { color: #14a68c;}
#field01 .btn { background-color: #14a68c; box-shadow: 0 7px 0 #006351;}
#field01 .feat1 { padding: 0 0 50px 59px;}
#field01 .feat1 .image { right: -12px; top: -16px;}
#field01 .feat2 { padding: 0 59px 50px 0; text-align: right;}
#field01 .feat2 .image { left: -13px; top: 5px;}
#field01 .feat3 { padding: 0 0 50px 59px;}
#field01 .feat3 .image { right: -12px; top: 4px;}

#field02 { background: #f0f0f0 url(../img/outline_field02_bg.jpg) no-repeat 50% 108px;}
#field02 .head { background:  url(../img/outline_field02_titlebg.jpg) no-repeat 50% 0;}
#field02 .body .image { right: -54px;}
#field02 li { border-color: #e9463f;}
#field02 .feat_head { color: #e9463f;}
#field02 .btn { background-color: #e9463f; box-shadow: 0 7px 0 #8f2a00;}
#field02 .feat1 { padding: 0 0 25px 59px;}
#field02 .feat1 .image { right: -30px; top: 18px;}
#field02 .feat2 { padding: 0 59px 40px 0; text-align: right;}
#field02 .feat2 .image { left: -14px; top: 9px;}
#field02 .feat3 { padding: 0 0 50px 59px;}
#field02 .feat3 .image { right: -22px; top: 25px;}
/*2016.05.06 */
#field02 .feat1 #field02_logo li{ border: none; float: left; margin: 10px 10px 0 0;}
#field02 .feat1 #field02_logo li img{ vertical-align:baseline ;}
#field03 { background: #f6fdff url(../img/outline_field03_bg.jpg) no-repeat 50% 108px;}
#field03 .head { background:  url(../img/outline_field03_titlebg.png) no-repeat 50% 0;}
#field03 .body { width: 700px;}
#field03 li { border-color: #33b5ff;}
#field03 .feat_head { color: #33b5ff;}
#field03 .btn { background-color: #33b5ff; box-shadow: 0 7px 0 #2a92ce;}
#field03 .feat1 { padding: 0 300px 50px 59px;}
#field03 .feat1 .image { right: -24px; top: 18px;}
#field03 .feat2 { padding: 40px 59px 40px 60px; text-align: right;}
#field03 .feat2 .image { left: -12px; top: 107px;}
#field03 .feat2 .feat_head { margin: 0 0 15px;}
#field03 .feat2 .feat_head span { clear: none;}
#field03 .feat2 .ico { margin: -77px 0 30px;}
#field03 .feat2 .logos { margin-top: 15px;}
#field03 .feat3 { padding: 0 350px 30px 59px;}
#field03 .feat3 .image { right: 22px; top: 28px;}


@media only screen and (min-width : 0px) and (max-width : 767px) {
#field01 { background-size: auto 950px; background-position: 54% 65px;}
#field01 .head .logo { width: 203px;}
#field01 .titleImg { width: 180px;}
#field01 .catchImg { width: 286px;}
#field01 .headImg { width: 256px;}
#field01 .feat1, #field01 .feat2, #field01 .feat3 { padding: 10px; text-align: left;}
#field01 .feat1 .image { right: 9px; top: -85px; width: 137px;}
#field01 .feat2 .image { left: 12px; top: -68px; width: 130px;}
#field01 .feat2 .ico { float: right;}
#field01 .feat3 .image { right: 12px; top: -50px; width: 90px;}

#field02 { background-size: auto 600px; background-position: 50% 65px;}
#field02 .head .logo { width: 156px;}
#field02 .titleImg { width: 184px;}
#field02 .catchImg { width: 262px;}
#field02 .headImg { width: 218px;}
#field02 .feat1, #field02 .feat2, #field02 .feat3 { padding: 10px; text-align: left;}
#field02 .feat1 .image { right: 9px; top: -70px; width: 127px;}
#field02 .feat2 .image { left: 6px; top: -58px; width: 150px;}
#field02 .feat2 .ico { float: right;}
#field02 .feat3 .image { right: 5px; top: -65px; width: 130px;}
#field02 .feat1 #field02_logo li{ margin: 10px 5px 0 0;}
#field03 { background-size: auto 600px; background-position: 54% 65px;}
#field03 .head .logo { width: 156px;}
#field03 .titleImg { width: 202px;}
#field03 .catchImg { width: 247px;}
#field03 .headImg { width: 220px;}
#field03 .body { width: 100%;}
#field03 .feat1, #field03 .feat2, #field03 .feat3 { padding: 12px; text-align: left;}
#field03 .feat1 .image { right: 6px; top: -70px; width: 123px;}
#field03 .feat2 .image { left: 6px; top: -65px; width: 107px;}
#field03 .feat2 .ico { float: right; margin: -40px 0 14px;}
#field03 .feat2 .feat_head span { clear: both;}
#field03 .feat2 .logos { margin: 1em auto; width: 170px;}
#field03 .feat3 .image { right: 10px; top: -70px; width: 101px;}
#field01 .btn { box-shadow: 0 4px 0 #006351;}
#field02 .btn { box-shadow: 0 4px 0 #8f2a00;}
#field03 .btn { box-shadow: 0 4px 0 #2a92ce;}
}

#next { background: url(../img/next_img01.jpg) no-repeat 50% 0; border-bottom: 1px solid #fff;}
#next .headline { text-align: center; margin-bottom: 94px;}
#next .inner { padding: 270px 0 100px;}
#next .pager { background: url(../img/next_img02.png) no-repeat 0 100%; padding-bottom: 40px; margin-bottom: 26px; background-size: contain;}
#next .page { text-align: center; text-decoration: none; width: 25%;}
#next .page .ttl { font-size: 27px; color: #3e90cd; font-weight: bold;}
#next .page .ttl span { font-size: 20px;}
#next .page .label { font-size: 14px; background-color: #fff; color: #3489ca; padding:6px 0 5px; margin-bottom: 18px; display: inline-block; width: 100px; text-align: center;}
#next .active .ttl { color: #155e91;}
#next .active .label { background-color: #ff5c7e; color: #fff;}
#next .slide { position: relative;}
#next .content { position: absolute; top: 87px; left: 280px; width:690px;}
#next .before { position: relative; padding-right: 110px; display: inline-block; text-align: center; vertical-align: top; float:left; }
#next .after { display: inline-block; text-align: center; vertical-align: top; float:left; }
#next .before:before { background: url(../img/next_case_arrow.png) no-repeat; position: absolute; right: 22px; top: 0; width: 75px; height: 214px; content: ''; display: block;}
#next .case_slide_head { font-size: 40px; font-weight: bold; line-height: 1; margin-bottom: 20px;}
#next .case_slide_copy { font-size: 16px; line-height: 2;}
#next .case_slide_head_sp { display: none;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
#next { background-size: auto 500px; background-color: #dcf0fa;}
#next .headline { padding: 0 20px; margin: 0 auto 45px; max-width: 420px;}
#next .inner { padding: 105px 0 35px;}
#next .pager { border-bottom: 1px solid #bee5f4; background: none; padding: 0; margin: 0;}
#next .page { background-color: #fff;}
#next .page + .page { border-left: 1px solid #bee5f4;}
#next .page .ttl { font-size: 13px; line-height: 2; background: url(../img/next_case_pagerarrow_noactive.png) no-repeat 50% 50%; background-size: 17px auto;}
#next .page .ttl span { display: none;}
#next .page .label { display: none;}
#next .active  { background-color: #ff5c7e;}
#next .active .ttl { color: #fff; background-image: url(../img/next_case_pagerarrow_active.png);}
#next .content { position: static; padding: 18px 10px; border-top: 2px dotted #3489ca; width:auto;}
#next .case_image { height: 9rem; width: auto; float: left; margin-right: -45px;}
#next .case_slide_head_sp { font-size: 2.7rem; height: 9rem; font-weight: bold; color: #155e91; line-height: 1; display: table-cell; vertical-align: middle;}
#next .case_slide_head_sp span { font-size: 2rem;}
#next .before { position: relative; padding: 0 0 30px; display: list-item; text-align: left; width:auto; float:none;}
#next .after { display: list-item; text-align: left; width:auto; float:none;}
#next .before:before { background: url(../img/next_case_arrow_sp.png) no-repeat; margin-right: -35px; right: 50%; top: auto; bottom: 0; width: 70px; height: 25px; background-size: contain;}
#next .case_slide_head { font-size: 1.6rem; font-weight: bold; line-height: 1; margin-bottom: 10px;}
#next .case_slide_copy { font-size: 1.1rem; line-height: 1.4;}
#next .sliderArea { margin: 0 20px; background-color: rgba(255,255,255,0.7);}
#next .sliderArea .bx-wrapper .bx-controls-direction a { top: 45px; margin-top: 0; width: 2rem;}
#next .sliderArea .bx-wrapper .bx-controls-direction .bx-prev { left: -10px;}
#next .sliderArea .bx-wrapper .bx-controls-direction .bx-next { right: -10px;}
}
@media only screen and (min-width : 767px) and (max-width : 1000px) {
	#next .content { left:17%; width:auto;}
	#next .sliderArea .bx-wrapper .bx-controls-direction .bx-prev { left: -10px;}
	#next .sliderArea .bx-wrapper .bx-controls-direction .bx-next { right: -10px;}
}

#experience { background: url(../img/experience_bg.jpg) no-repeat 50% 0;}
#experience .inner { padding: 90px 0; position: relative; height: 1028px;}
#experience .inner .arrow { position: absolute; margin-left: -188px; left: 50%; bottom: -54px;}
#experience .headline { text-align: center; margin-bottom: 48px;}
#experience .sliderArea .bx-wrapper { background-color: #fff; }
#experience .sliderArea .bx-wrapper .bx-controls-direction a { width: 31px; text-decoration: none; top: 270px; margin-top: 0;}
#experience .sliderArea .bx-wrapper .bx-prev { left: 10px;}
#experience .sliderArea .bx-wrapper .bx-next { right: 10px;}
#experience .pager { margin-bottom: -16px; position: relative; z-index: 10; width: 980px;}
#experience .pager .pagerContainer { position: relative;}
#experience .pager .page .on { position: absolute; visibility: hidden; top: 0; left: 0;}
#experience .pager .page + .page { margin-left: 10px;}
#experience .pager .page .name { font-size: 18px; color: #868789; font-weight: bold; display: block; text-align: center; padding: 66px 0 0 50px; position: absolute; top: 0; left: 0; z-index: 1; width: 100%;}
#experience .pager .active .on { visibility: visible;}
#experience .pager .active .name { color: #fff;}
#experience .slider .slide { padding: 50px 0 30px;}
#experience .slider .body { position: relative; padding: 0 60px 0 275px; width: 980px;}
#experience .slider .body .catch { font-size: 30px; font-weight: bold;}
#experience .slider .body .pht { top: 0; left: 60px; position: absolute;}
#experience .slider .body .profile { font-size: 16px; background-color: #f3f5fa; padding: 10px 15px;}
#experience .slider .sec { margin: 20px 0;}
#experience .slider .sec dt { font-size: 26px; margin-bottom: 15px;}
#experience .slider .sec dd { font-size: 16px; line-height: 1.5;}
#experience .slider .btnArea { text-align: center;}
#experience .slider .btnArea .btn { display: inline-block; background-color: #666; padding: 15px 70px 15px; text-align: center; width: 490px; border-radius: 5px;}
#experience .slider .btnArea .btn span { display: block; background: url(../img/outline_btnarrow.png) no-repeat 100% 0; height: 21px; -webkit-background-size: auto 21px; background-size: auto 21px;}
#experience .slider .btnArea .btn span img { height: 21px;}
#experience .slider .ex1 .btn { background-color: #14a68c; box-shadow: 0 5px 0 #006351;}
#experience .slider .ex2 .btn { background-color: #e9463f; box-shadow: 0 5px 0 #8f2a00;}
#experience .slider .ex3 .btn { background-color: #33b5ff; box-shadow: 0 5px 0 #2a92ce;}
#experience .slider .ex1 .profile { background-color: #f4fff8;}
#experience .slider .ex2 .profile { background-color: #fff0ef;}
#experience .slider .ex3 .profile { background-color: #f6fdff;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
#experience .inner { padding: 30px 0 20px; position: relative; height: auto;}
#experience .inner .arrow { position: absolute; margin-left: -90px; left: 50%; bottom: -26px; width: 180px;}
#experience .headline { padding: 0 15px; margin-bottom: 18px;}
#experience .sliderArea .bx-wrapper .bx-controls-direction a { width: 1.2rem; top: 140px; text-decoration: none;}
#experience .sliderArea .bx-wrapper .bx-prev { left: 2px;}
#experience .sliderArea .bx-wrapper .bx-next { right: 2px;}
#experience .pager { margin: 0 15px -5px; width: auto;}
#experience .pager .page { width: 33.33%; padding: 0 3px;}
#experience .pager .page + .page { margin-left: 0;}
#experience .pager .page .name { display: none;}
#experience .slider .slide { padding: 0 0 20px;}
#experience .slider .body { position: relative; padding: 20px; width: 100%;}
#experience .slider .body .catch { font-size: 1.6rem; text-align: center;}
#experience .slider .body .name { font-size: 1.4rem; text-align: center; display: block; margin-bottom: 15px;}
#experience .slider .body .prof { display: table; width: 100%;}
#experience .slider .body .pht { position: static; width: 80px; padding-right: 5px; display: table-cell;}
#experience .slider .body .pht .phtImg { width: 75px;}
#experience .slider .body .profile { font-size: 15px; padding: 6px; display: table-cell; vertical-align: top;}
#experience .slider .body .profile .profile_txt { line-height: 1.4;}
#experience .slider .sec dt { font-size: 19px; margin-bottom: 5px;}
#experience .slider .sec dd { font-size: 15px; line-height: 1.4;}
#experience .slider .btnArea { padding: 0 10px;}
#experience .slider .btnArea .btn { padding: 15px 25px; width: 100%;}
#experience .slider .btnArea .btn span { height: auto; background-size: auto 15px; padding: 0 30px;}
#experience .slider .btnArea .btn span img { height: 15px;}
}

#sitelink { background: url(../img/sitelink_bg.jpg) no-repeat 50% 0;}
#sitelink .inner { padding: 98px 0 60px;}
#sitelink .headline { margin-bottom: 50px; text-align: center;}
#sitelink .head_img-1 { margin: 0 12px 0 0;}
#sitelink .sitelink_block { margin-bottom: 45px; overflow: hidden; width:980px;}
#sitelink .col { width: 320px; float: left; background-color: #f9f9f8; border: 1px solid #fff;}
#sitelink .col + .col { margin-left: 10px;}
#sitelink .head { border-bottom: 1px solid #313131;}
#sitelink .head img { width:100%; }
#sitelink .copy { line-height: 60px; text-align: center;}
#sitelink .sitelink_copyImg { width: 280px; vertical-align: middle;}
#sitelink .logo { height: 50px; margin-top: 20px; text-align: center;}
#sitelink .sitelink_logoImg { width: 280px; vertical-align: middle;}
#sitelink .body { padding: 40px 0 0;}
#sitelink .body .btn { padding: 20px 0; text-align: center;}
.sitelink_detailBtn { width: 160px;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
#sitelink { background-size: auto 100%;}
#sitelink .inner { padding: 45px 0 25px;}
#sitelink .headline { margin-bottom: 25px;}
#sitelink .head_img-1 { margin: 0 auto 13px; width: 190px; display: block;}
#sitelink .head_img-2 { width: 268px;}
#sitelink .sitelink_block { margin: 0 5px; width:auto;}
#sitelink .col { margin-bottom: 15px; width: 100%; float: none;}
#sitelink .col + .col { margin-left: 0;}
#sitelink .copy { line-height: 1;}
#sitelink .sitelink_copyImg { width: 230px;}
#sitelink .logo { height: auto; margin-top: 10px;}
#sitelink .sitelink_logoImg { width: 230px;}
#sitelink .body { padding: 20px 0 0;}
#sitelink .body .btn { padding: 10px 15px;}
#sitelink .last { padding: 0 10px;}
}

#company .inner { padding: 80px 0;}
#company .headline_2 { margin: 45px 0 60px;}
#company .company { font-size: 18px; width: 100%;}
#company th { padding: 25px 0 0 55px; width: 230px; text-align: left; font-weight: normal;}
#company tr:nth-child(odd) { background-color: #f8f8f8;}
#company td { padding: 25px; text-align: left;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
.company_titleImg { width: 240px;}
#company .inner { padding: 34px 5px;}
#company .headline_2 { margin: 15px 0 40px;}
#company .headline_2 .text_company { width: 94px;}
#company .company { font-size: 15px; }
#company tr { display: block; padding: 15px; }
#company th { display: block; padding: 0 0 5px; font-weight: bold;}
#company td { display: block; padding: 0;}
#company td p { line-height: 1.4;}
}

#support .headline_2 { margin: 45px 0 60px;}
#support .inner { padding: 0 0 60px;}
#support .location { background-color: #f8f8f8; padding: 0 26px 50px; overflow: hidden;}
#support .location .map_head { font-size: 22px; text-align: center; padding: 56px 0 50px;}
#support .location dl { line-height: 1.6;}
#support .location dt { font-size: 16px; font-weight: bold;}
#support .location dd { margin-bottom: 1em;}
#support .location .map { float: left; margin-right: 20px;}

@media only screen and (min-width : 0px) and (max-width : 767px) {
.support_titleImg { width: 233px;}
#support .headline_2 { margin: 15px 0 40px;}
#support .headline_2 .text_location { width: 96px;}
#support .inner { padding: 0 5px 20px;}
#support .location { border-radius: 15px; padding: 0 15px 15px;}
#support .location dt { font-size: 15px;}
#support .location dd { font-size: 15px;}
#support .location .map_head { font-size: 1.6rem; padding: 25px 0;}
#support .location .map { float: none; margin-right: 0; padding: 0 30px;}
}

/*----------------------------------------------------------
    Styles for over 2000px screen
----------------------------------------------------------*/
@media (min-width: 2000px) { 
#kv, #threefield, #field01, #field01 .head, #field02, #field02 .head, #field03, #field03 .head, #next, #experience, #sitelink { background-size: cover; }
}