/* ===================================================================
CSS information
file name  :  style.css
style info :  All Page Desining
=================================================================== */

@charset "UTF-8";
/*--------
default
--------*/

html {
    height: 100%;
    overflow: auto;
}

body {
    height: 100%;
    background: url('../index_2018/bg.jpg') repeat;
    font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'Meiryo', 'sans-serif';
}

.contents_all,
#wrap {
    min-width: 1200px;
    text-align: center;
    margin: 0px auto;
}

h1 img {
    font-size: 0%;
    line-height: 0;
    margin: 0 auto;
    vertical-align: bottom;
}

#recommend,
#voice,
#teller,
#guide,
#wrap
{
    margin-top:-85px;
    padding-top:85px;
}


/*---------------------------------------------------------------------
  header
--------------------------------------------------------------------*/

.fvw {
    width: 100%;
    min-width: 1200px;
    margin: 0 auto;
}

header.head_contents {
    background: url('../index_2018/mainvis.png') center top no-repeat;
    min-width: 1200px;
    margin: 0 auto;
}

.gnav {
    background: url('../index_2018/nav_bg.jpg') repeat-x;
    height: 85px;
    z-index: 88888;
    margin: 0 auto;
    width: 100%;
    min-width: 980px;
    position: fixed;
    top: 0;
}

.gnav ul {
    width: 980px;
    height: 77px;
    padding-top: 8px;
    margin: 0 auto;
    overflow: hidden;
    display: flex;
    justify-content: center;
}

.gnav li {
    float: left;
}

.title {
    width: 1200px;
    height: 173px;
    margin: 0 auto;
    padding-top: 85px;
}

.freebtn_area {
    background: url('../index_2018/title_bg.jpg') center top no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-width: 1200px;
    min-width: 100%\9;
    /*for IE8-6 */
    width: 100%;
    margin: 0 auto;
    text-align: center;
    height: 443px;
    height: 443px\9;
    /*for IE8-6 */
    position: relative;
}

.freebtn {
    position: absolute;
    bottom: -45px;
    left: 0px;
    right: 0px;
}

.freebtn_arrow {
    position: absolute;
    bottom: -5px;
    left: 0px;
    right: 0px;
}

.freebtn_arrow span img {
    -webkit-animation: sdb 2s infinite;
    animation: sdb 2s infinite;
    box-sizing: border-box;
}

@-webkit-keyframes sdb {
    0% {
        -webkit-transform: translate(0, 0);
    }
    25% {
        -webkit-transform: translate(0, 8px);
    }
    50% {
        -webkit-transform: translate(0, 0);
    }
}

@keyframes sdb {
    0% {
        transform: translate(0, 0);
    }
    25% {
        transform: translate(0, 8px);
    }
    50% {
        transform: translate(0, 0);
    }
}





/*--------
contents1
--------*/

.contents1 {
    background: url('../index_2018/bg2.jpg') repeat;
    min-width: 1200px;
}

.contents1_cap {
    height: 188px;
    width: 1200px;
    margin: 0 auto;
}

#onayami_Area {
    width: 100%;
    min-width: 1200px;
    height: 796px;
    margin: 0 auto;
}

.onayami1 {
    background: url('../index_2018/contents1_01bg.jpg') repeat-x;
    background-position: center top;
    height: 199px;
    width: 100%;
    min-width: 1200px;
}

.onayami1_bg {
    background: url('../index_2018/contents1_01.jpg') no-repeat;
    width: 1200px;
    height: 199px;
    margin: 0 auto;
    position: relative;
}

.contents1_btn {
    position: absolute;
    top: 0px;
    right: 110px;
}

.onayami2 {
    background: url('../index_2018/contents1_02bg.jpg') repeat-x;
    background-position: center top;
    height: 199px;
    width: 100%;
    min-width: 1200px;
}

.onayami2_bg {
    background: url('../index_2018/contents1_02.jpg') no-repeat;
    width: 1200px;
    height: 199px;
    margin: 0 auto;
    position: relative;
}

.onayami2_bg_01a {
    background: url('../index_2018/contents1_02_01a.jpg') no-repeat;
    width: 1200px;
    height: 199px;
    margin: 0 auto;
    position: relative;
}

.onayami3 {
    background: url('../index_2018/contents1_03bg.jpg') repeat-x;
    background-position: center top;
    height: 199px;
    width: 100%;
    min-width: 1200px;
}

.onayami3_bg {
    background: url('../index_2018/contents1_03.jpg') no-repeat;
    width: 1200px;
    height: 199px;
    margin: 0 auto;
    position: relative;
}

.onayami4 {
    background: url('../index_2018/contents1_04bg.jpg') repeat-x;
    background-position: center top;
    height: 199px;
    width: 100%;
    min-width: 1200px;
}

.onayami4_bg {
    background: url('../index_2018/contents1_04.jpg') no-repeat;
    width: 1200px;
    height: 199px;
    margin: 0 auto;
    position: relative;
}




/*--------
contents2
--------*/

.contents2 {
    min-width: 1200px;
}

.contents2_cap {
    height: 172px;
    width: 1200px;
    margin: 0 auto;
}

#box03 {
    background: url('../index_2018/contents2_bg.jpg') center top no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-width: 1200px;
    min-width: 100%\9;
    /*for IE8-6 */
    width: 100%;
    margin: 0 auto;
    text-align: center;
    height: 763px;
    /*for IE8-6 */
}

#box03 ul.voice {
    position: relative;
    width: 980px;
    height: 763px;
    margin: 0 auto;
}

#box03 ul.voice li {
    list-style-type: none;
}

#box03 ul.voice li.person01 {
    background: url('../index_2018/contents2_01.png') no-repeat;
    position: absolute;
    top: 60px;
    left: 27px;
    width: 450px;
    height: 307px;
    margin: auto;
}

#box03 ul.voice li.person02 {
    background: url('../index_2018/contents2_02.png') no-repeat;
    position: absolute;
    top: 60px;
    right: 27px;
    width: 450px;
    height: 307px;
    margin: auto;
}

#box03 ul.voice li.person03 {
    background: url('../index_2018/contents2_03.png') no-repeat;
    position: absolute;
    bottom: 60px;
    left: 27px;
    width: 450px;
    height: 307px;
    margin: auto;
}

#box03 ul.voice li.person04 {
    background: url('../index_2018/contents2_04.png') no-repeat;
    position: absolute;
    bottom: 60px;
    right: 27px;
    width: 450px;
    height: 307px;
    margin: auto;
}

#box03 ul.voice li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 450px;
    height: 307px;
    margin: auto;
}

/* 2024.08.26 rk add -------------------------------------- #box03 ＞ #box03_01a ---*/
#box03_01a {
    background: url('../index_2018/contents2_bg.jpg') center top no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-width: 1200px;
    min-width: 100%\9;
    /*for IE8-6 */
    width: 100%;
    margin: 0 auto;
    text-align: center;
    /*height: 763px;*/
	height: 1170px;
    /*for IE8-6 */
}

#box03_01a ul.teller {
    position: relative;
    width: 980px;
    height: 763px;
    margin: 0 auto;
}

#box03_01a ul.teller li {
    list-style-type: none;
}

#box03_01a ul.teller li.person01 {
    background: url('../index_2018/teller_a_01a.png') no-repeat;
    position: absolute;
    height: 307px;
    left: 27px;
    margin: auto;
    position: absolute;
    top: 60px;
    width: 927px;
}

#box03_01a ul.teller li.person02 {
    background: url('../index_2018/teller_b_01a.png') no-repeat;
    height: 307px;
    left: 27px;
    margin: auto;
    position: absolute;
    top: 430px;
    width: 927px;
}

#box03_01a ul.teller li.person03 {
    background: url('../index_2018/teller_c_01a.png') no-repeat;
    height: 307px;
    left: 27px;
    margin: auto;
    position: absolute;
    top: 800px;
    width: 927px;
}

#box03_01a ul.teller li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 450px;
    height: 307px;
    margin: auto;
}

/*--------
contents3
--------*/

.contents3 {
    min-width: 1200px;
}

.contents3_cap {
    height: 171px;
    width: 1200px;
    margin: 0 auto;
}

.guide_area {
    width: 100%;
    min-width: 1200px;
    height: 1130px;
    margin: 0 auto;
}

.guide1 {
    background: url('../index_2018/contents3_01bg.jpg') repeat-x;
    background-position: center top;
    height: 186px;
    width: 100%;
    min-width: 1200px;
}

.guide2 {
    background: url('../index_2018/contents3_02bg.jpg') repeat-x;
    background-position: center top;
    height: 211px;
    width: 100%;
    min-width: 1200px;
}

.guide3 {
    background: url('../index_2018/contents3_03bg.jpg') repeat-x;
    background-position: center top;
    height: 211px;
    width: 100%;
    min-width: 1200px;
}

.guide4 {
    background: url('../index_2018/contents3_04bg.jpg') repeat-x;
    background-position: center top;
    height: 186px;
    width: 100%;
    min-width: 1200px;
}

.guide5 {
    background: url('../index_2018/contents3_05bg.jpg') repeat-x;
    background-position: center top;
    height: 336px;
    width: 100%;
    min-width: 1200px;
}

.caption {
    width: 1200px;
    height: 479px;
    margin: 0 auto;
}


/*--------
form.second
--------*/

#wrap {
    width: 980px;
    height: 100%;
}

#box06 {
    width: 980px;
    display: table;
    margin: 0 auto;
    height: auto;
}

#box06 #p_center,
#p_center {
    background: url('../index_2018/form_center.png') repeat-y;
    background-position: center top;
    width: 980px;
    margin: 0 auto;
}

.form_bottom {
    vertical-align: top;
}

#box06 h1 {
    width: 980px;
    margin: 0 auto;
}

#box06 table {
    margin: 0px auto 30px;
}

#box06 table th {
    padding: 35px 0 0 0;
    text-align: center;
    vertical-align: middle;
}

#box06 table input[type="text"] {
    height: 30px;
    vertical-align: middle;
}

#box06 table td {
    padding: 40px 0 0 30px;
    width: 424px;
    color: #000000;
    vertical-align: middle;
}

#box06 select {
    vertical-align: middle;
}

p.domain_txt {
    font-size: 14px;
    line-height: 1.4em;
    color: #000000;
    padding-top: 30px;
}

.domain {
    margin: 0 auto;
    height: 133px;
}



/*--------
second text
--------*/

#s_txt {
    width: 700px;
    font-size: 14px;
    text-align: left;
    line-height: 1.4em;
    margin: 0 auto;
    color: #000000;
    font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'Meiryo', 'sans-serif';
    letter-spacing: 1px;
}

#s_txt h3 {
    padding: 20px 0 0 1px;
    font-size: 15px;
    margin: 0;
    color: #866b00;
    font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'Meiryo', 'sans-serif';
    border-bottom: 1px dotted #866b00;
}

#s_txt p,
#s_txt ul,
#s_txt ol {
    padding-top: 15px;
}

#s_txt p,
#s_txt ul {
    padding-left: 20px;
}

#s_txt ul {
    list-style: none;
}

#s_txt ol {
    padding-left: 30px;
}

#s_txt a:link {
    font-size: 13px;
    line-height: 1.2em;
    color: #0a78cd;
    text-decoration: none;
}

#s_txt a:visited {
    font-size: 13px;
    line-height: 1.2em;
    color: #196dd4;
    text-decoration: none;
}

#s_txt a:hover {
    font-size: 13px;
    line-height: 1.2em;
    color: #108dee;
    text-decoration: none;
}

#s_txt a:active {
    font-size: 13px;
    line-height: 1.2em;
    color: #33a6ff;
    text-decoration: none;
}

.mark_clr {
    color: #866b00;
}



/*--------
footer
--------*/

#footer {
    background: url('../index_2018/footer_bg.png') no-repeat;
    width: 1200px;
    height: 105px;
    margin: 0 auto;
    text-align: center;
}

#f_link {
    min-width: 1200px;
    min-width: 100%\9;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
    padding: 30px 0 10px;
    color: #ffffff;
}

#f_link a:link {
    font-size: 14px;
    line-height: 1.5em;
    color: #ffffff;
    text-decoration: none;
}

#f_link a:visited {
    font-size: 14px;
    line-height: 1.5em;
    color: #9eb6bb;
    text-decoration: none;
}

#f_link a:hover {
    font-size: 14px;
    line-height: 1.5em;
    color: #e0cc85;
    text-decoration: non e;
}

#f_link a:active {
    font-size: 14px;
    line-height: 1.5em;
    color: #ddbb59;
    text-decoration: none;
}

p.copyright {
    font-size: 14px;
    color: #ffffff;
    padding-bottom: 25px;
}


/*--------
form input
--------*/

div.radio-group {
    margin-top: 5px;
}

div.radio-group input {
    opacity: 0;
    /*
  opacity: 0;
     filter: alpha(opacity=0);
  */
}

div.radio-group div {
    position: relative;
}

div.radio-group input {
    position: absolute;
    left: 0px;
    outline: none;
}

div.radio-group label {
    cursor: pointer;
    padding: 10px 0px 0px 0px;
    float: left;
    background: url('../index_2018/index1_off.png') no-repeat;
    width: 211px;
    height: 42px;
    color: #ffffff;
    font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
    font-size: 18px;
    line-height: 1.4;
    text-align: center;
    vertical-align: middle;
}

div.radio-group label.checked {
    background: url('../index_2018/index1_on.png') no-repeat;
    width: 211px;
    height: 42px;
}

div#blood div.radio-group label {
    cursor: pointer;
    padding: 10px 0px 0px 0px;
    float: left;
    background: url('../index_2018/index2_off.png') no-repeat;
    width: 106px;
    height: 42px;
    color: #ffffff;
    font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
    font-size: 18px;
    line-height: 1.4;
    text-align: center;
    vertical-align: middle;
}

div#blood div.radio-group label.checked {
    background: url('../index_2018/index2_on.png') no-repeat;
    width: 106px;
    height: 42px;
}

input[type="text"]:focus {
    outline: 0;
    border-color: #ffd800;
}


/*---------------------------------------------------------------------
  other
----------------------------------------------------------------*/

.clearfix:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
}

* html .clearfix {
    zoom: 1;
}

/* IE6 */

*:first-child+html .clearfix {
    zoom: 1;
}

/* IE7 */