@charset "UTF-8";

/* Base Theme ============================================================= */

/* Reset ------------------------------------------------------------------ */

/*
    reset.css - resets default browser styling
    http://tantek.com/log/2004/09.html#d06t2354
    http://www.vox.com/.shared/css/base.css by beausmith.com
    http://developer.yahoo.com/yui/reset/
*/

html{
font-size: 100%;
} 
body{
background: #fff;
/*font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, sans-serif;*/
font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
color: #5d5d5d;
}

img{
max-width: 100% !important;
height: auto !important;
width /***/:auto; /*IE8のみ適用*/
}

*{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

html{-webkit-text-size-adjust: none;}

html,body,div,
ul,ol,li,dl,dt,dd,
form,fieldset,input,textarea,
h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr,
figure,
th,td,small {
    margin: 0;
    padding: 0;
}

h1,h2,h3,h4,h5,h6 {
    font-size: 100%;
}

table {
    border-spacing: 0;
}
fieldset,img,abbr,acronym {
    border: 0;
}
/* strict reset by uncommenting lines below */
address,caption,cite,code,dfn,em,strong,b,u,s,i,th,var {
    /* font-style: normal; */
    /* font-weight: normal; */
}

a{
/* color: #666666;
color: #373737; */
text-decoration: none;
}
a,
a::before,
a::after{
-webkit-transition: all .3s;
transition: all .3s;
}


ol,ul {
    list-style: none;
}
caption,th {
    text-align: left;
}
q:before,q:after {
    content: '';
}



a img,:link img,:visited img {
    border: none;
}

a:hover{
text-decoration: none;
}

address {
    font-style: normal;
    display: inline;
}

img{
vertical-align: top;
}


/* Utilities ----------------------------------------------------------------- */

.pkg:after{
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
}
*:first-child+html .pkg{
display: inline-table;
min-height: 1%;
}
.pkg{ display: block; }
/* no ie mac \*/
* html .pkg{ height: 1%; }
.pkg{ display: block; }
/* */

.inline { display: inline; }
.hidden { display: none; }


.thumb a:hover{
    filter:alpha(opacity=70);  /* IE7以下用 */
    -ms-filter: "alpha(opacity=70)"; /* IE8用 */
    -moz-opacity:0.7; /* Firefox 1.5未満, Netscape用 */
    -khtml-opacity: 0.7;  /* Safari 1.x, 他khtmlに対応したブラウザ用  */
    opacity: 0.7; /* Firefox 1.5以上, Opera, Safari用 */
}

a.thumb:hover{
    filter:alpha(opacity=70);  /* IE7以下用 */
    -ms-filter: "alpha(opacity=70)"; /* IE8用 */
    -moz-opacity:0.7; /* Firefox 1.5未満, Netscape用 */
    -khtml-opacity: 0.7;  /* Safari 1.x, 他khtmlに対応したブラウザ用  */
    opacity: 0.7; /* Firefox 1.5以上, Opera, Safari用 */
}


/* Common Classes --------------------------------------------------------- */

.img0{ font-size: 0px; line-height: 0; }

.left{ float: left; }
.right{ float: right; }
.center{ margin-left: auto; margin-right: auto; }

.txt-right{ text-align: right; }
.txt-left{ text-align: left; }
.txt-center{ text-align: center; }

.red{ color: #d51900;}

.f11{ font-size: 11px; }
.f12{ font-size: 12px; }
.f13{ font-size: 13px; }
.f14{ font-size: 14px; }
.f16{ font-size: 16px; }
.f18{ font-size: 18px; }

.b5{ margin-bottom: 5px; }
.b8{ margin-bottom: 8px; }
.b10{ margin-bottom: 10px; }
.b15{ margin-bottom: 15px; }
.b20{ margin-bottom: 20px; }
.b25{ margin-bottom: 25px; }
.b30{ margin-bottom: 30px; }
.b35{ margin-bottom: 35px; }
.b40{ margin-bottom: 40px; }
.b45{ margin-bottom: 45px; }
.b50{ margin-bottom: 50px; }
.b55{ margin-bottom: 55px; }
.b60{ margin-bottom: 60px; }
.b65{ margin-bottom: 65px; }
.b70{ margin-bottom: 70px; }

.t5{ margin-top: 5px; }
.t10{ margin-top: 10px; }
.t15{ margin-top: 15px; }
.t20{ margin-top: 20px; }
.t25{ margin-top: 25px; }
.t30{ margin-top: 30px; }
.t35{ margin-top: 35px; }
.t40{ margin-top: 40px; }
.t45{ margin-top: 45px; }
.t50{ margin-top: 50px; }

.l5{ margin-left: 5px; }
.l6{ margin-left: 6px; }
.l10{ margin-left: 10px; }
.l15{ margin-left: 15px; }
.l20{ margin-left: 20px; }
.l25{ margin-left: 25px; }
.l30{ margin-left: 30px; }
.l35{ margin-left: 35px; }
.l40{ margin-left: 40px; }
.l45{ margin-left: 45px; }
.l50{ margin-left: 50px; }
.l60{ margin-left: 60px; }

.r5{ margin-right: 5px; }
.r10{ margin-right: 10px; }
.r15{ margin-right: 15px; }
.r20{ margin-right: 20px; }
.r25{ margin-right: 25px; }
.r30{ margin-right: 30px; }
.r35{ margin-right: 35px; }
.r40{ margin-right: 40px; }
.r45{ margin-right: 45px; }
.r50{ margin-right: 50px; }

.clr {
clear: both;
}



.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  margin: 0 ;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
  
  
.rslides-tablet {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  margin: 0 ;
  }

.rslides-tablet li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides-tablet li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides-tablet img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }


#sp-nav{
display: none;
}
@media only screen and (max-width: 640px){
#sp-nav {
display: block;
}
}



.lnk{
text-align: center;
}
.lnk a{
position: relative;
display: inline-block;
text-align: left;
color: #00479b;
border: 2px solid #00479b;
padding: .8rem 1.5rem .8rem 3rem;
}
.lnk a:hover{
color: #1276f2;
border: 2px solid #1276f2;
}
.lnk a:before{
font-family: 'icomoon';
content: "\e600";
line-height: 1em;
position: absolute;
top: 50%;
left: .8rem;
margin-top: -.5em;
}

.arrow:before{
font-family: 'icomoon';
content: "\e600";
font-size: 80%;
margin-right: .25em;
}

.kome{
text-indent: -1em;
padding-left: 1em;
font-size: 90%;
}

/* Web Fonts --------------------------------------------------------- */
@font-face {
font-family: 'icomoon';
src:url('/oto/common/fonts/icomoon.eot?hfmq8m');
src:url('/oto/common/fonts/icomoon.eot?hfmq8m#iefix') format('embedded-opentype'),
url('/oto/common/fonts/icomoon.ttf?hfmq8m') format('truetype'),
url('/oto/common/fonts/icomoon.woff?hfmq8m') format('woff'),
url('/oto/common/fonts/icomoon.svg?hfmq8m') format('svg');
font-weight: normal;
font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;

/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.icon-key3:before {
content: "\e908";
}
.icon-key2:before {
content: "\e909";
}
.icon-key1:before {
content: "\e90a";
}
.icon-tel2:before {
content: "\e906";
}
.icon-tel:before {
content: "\e904";
}
.icon-mail2:before {
content: "\e907";
}
.icon-mail:before {
content: "\e905";
}
.icon-border2:before {
content: "\e903";
}
.icon-arrow3:before {
content: "\e902";
}
.icon-border:before {
content: "\e901";
}
.icon-arrow2:before {
content: "\e900";
}
.icon-pdf:before {
content: "\e602";
}
.icon-dot:before {
content: "\e603";
}
.icon-blank:before {
content: "\e601";
}
.icon-arrow:before {
content: "\e600";
}