@charset "UTF-8";
/* CSS Information ===========
File name:Style.css
Description: Naminoue Umi-sora Park
D&M/IJU inc.
Date: 2018
Contents: *All Page
Rem:1rem/10px
=============================== */
/* Css Reset */
html{font-size:100%;} html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q,
samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,
figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{
margin:0; padding:0; border:0; outline:0; font-size:100%; font-style:normal; vertical-align:middle; background:transparent;}
body{line-height:1.7;} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;} ul,ol {list-style:none;} blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:""; content:none;} a{margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}
ins {background-color:transparent; color:#000; text-decoration:none;} mark {background-color:transparent; color:#000; font-style:normal; font-weight:normal;}
del {text-decoration: line-through;} abbr[title], dfn[title] {border-bottom:0.1rem dotted; cursor:help;} table {border-collapse:collapse; border-spacing:0;}
hr{display:block; height:0.1rem; border:0; border-top:0.1rem solid #cccccc; margin:1.6rem 0; padding:0;} input, select {vertical-align:middle;} iframe{border:0;}
/* ------------------- */
*, *:before, *:after{box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box;} ul,ol,li{margin:0; padding:0; list-style-type:none;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary{display: block;} .container:before, .container:after {content:""; display: table;}
a:before, a:after{text-decoration:none;}
/* ------------------- */
input[type="text"], input[type="password"], input[type="file"], input[type="hidden"], input[type="submit"], input[type="reset"], input[type="image"], input[type="number"], input[type="tel"], input[type="email"],
button, textarea, select{margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none; appearance: none;}
/* iOS reset */
input[type="submit"],input[type="button"],input[type="reset"],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,input[type="reset"]::-webkit-search-decoration,button::-webkit-search-decoration{display: none;}
input[type="submit"]:focus,input[type="button"]:focus,input[type="reset"]:focus,button:focus{outline-offset: -0.2rem;}
/*=======
public Style
=====================*/
/*[font-family:-apple-system,BlinkMacSystemFont,Meiryo,"メイリオ","Hiragino Sans","Hiragino Kaku Gothic ProN","Segoe UI","游ゴシック","Yu Gothic",sans-serif;]*/
html{overflow-x:hidden; font-size:62.5%;}
body{font-size:1.8rem; letter-spacing:0; padding:0!important; margin:0; color:#555; width:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;
background:url("../img/body_bg.jpg") no-repeat center center; background-attachment:fixed; background-size:cover;}
/* Multilingual  Font Chang */
/* [En] */
body.font-en{font-family:-apple-system,"BlinkMacSystemFont","Helvetica Neue","Hiragino Kaku Gothic ProN","Arial","Meiryo", sans-serif;}
body.font-en input,body.font-en select,body.font-en textarea,body.font-en button{font-family:-apple-system,"BlinkMacSystemFont","Helvetica Neue","Hiragino Kaku Gothic ProN","Arial","Meiryo", sans-serif;}
body.font-en .font-min{font-family:Georgia,Times,"Times New Roman",serif;}
/* [Ko] */
body.font-ko{font-family:"Malgun Gothic","Yoon Gothic",sans-serif;}
body.font-ko input,body.font-ko select,body.font-ko textarea,body.font-ko button{font-family:"Malgun Gothic","Yoon Gothic",sans-serif;}
/* [zh-Hant] */
body.font-zh--hant{font-family:"Microsoft JhengHei","微軟正黑體","PMingLiU",sans-serif;}
body.font-zh--hant input,body.font-zh--hant select,body.font-zh--hant textarea,body.font-zh--hant button{font-family:"Microsoft JhengHei","微軟正黑體","PMingLiU",sans-serif;}
body.font-zh--hant .font-min{font-family:"Microsoft JhengHei","微軟正黑體","PMingLiU",sans-serif;;}
/* [zh-Hans] */
body.font-zh--hans{font-family:"メイリオ","Hiragino Kaku Gothic ProN",sans-serif;}
body.font-zh--hans input,body.font-zh--hans select,body.font-zh--hans textarea,body.font-zh--hans button{font-family:"Microsoft YaHei","微软雅黑","SimSun",sans-serif;}
body.font-zh--hans .font-min{font-family:"游明朝","YuMincho",sans-serif;}
/*-----*/
img{width:100%;}
.adress-break{word-break:break-all;}
.caution-red{color:#e75258;}
.caution-blue{color:#005398;}
/* link */
a{text-decoration:underline; outline:none;}
a:link{color:#555; text-decoration:underline;}/*未訪問*/
a:visited{color:#555;}/*訪問済*/
/* Micro Clearfix */
.cf:before, .cf:after{content:""; display:table;}
.cf:after{clear:both;} .cf{zoom:1;}
/* Micro Clearfix [ IE9 Hack ] */
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf-ie9:before, .cf-ie9:after{content:"";display:table;}}/*IE9*/
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf-ie9:after{clear:both;}}/*IE9*/
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf-ie9{zoom:1;}}/*IE9*/
/* FlexBox */
.flex{display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;}
.flex-horizon--end{-webkit-justify-content:flex-end; -ms-flex-pack:end; justify-content:flex-end;}
.flex-horizon--ctr{-webkit-justify-content:center; -ms-flex-pack:center; justify-content:center;}
.flex-vertical--end{-webkit-align-items:flex-end; -ms-align-items:flex-end; align-items:flex-end;}
.flex-vertical--ctr{-webkit-box-align:center; -ms-flex-align:center; -webkit-align-items:center; align-items:center;}
.flex-wrap{-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
.flex-direction--reverse{-ms-flex-direction:row-reverse; -webkit-flex-direction:row-reverse; flex-direction:row-reverse;}
/* Operation(fixed) */
.operation{position:fixed; bottom:0; left:0; z-index:100; width:100%;}
.operation_arrow{position:absolute; bottom:4rem; right:3.5rem;}
.operation_arrow a{border-radius:50%; display:block; width:6rem; height:6rem; font-size:4rem; line-height:5.5rem; background-color:rgba(0,160,198,.85); color:#fff; text-align:center;}
.operation_arrow a:hover{color:#fff;}
/*=======
Header
====================*/
.header{width:100%; max-width:128rem; margin:0 auto; padding:4rem 2rem; background:#00a0c6; position:relative;}
.header_logo{width:100%; text-align:center; color:#fff; font-size:4.4rem; font-weight:bold; line-height:1.1;}
.header_logo span{display:inline-block; margin-right:0.5rem;}
.header_wrap{position:fixed; left:auto; top:5.5rem; z-index:4; width:calc(100% - 7rem); max-width:124rem;}
.header_link{width:9.3rem; position:absolute; right:0;}
.header_btn:first-child{margin-right:0.5rem;}
.header_btn a,.header_btn span{display:block; width:4.4rem; height:4.4rem; line-height:4rem; background:rgba(0,0,0,.7); color:#fff; text-align:center; border-radius:50%; cursor:pointer;
box-shadow:0 0 0.3rem 0.3rem rgba(0,0,0,.1);}
.header_btn i{font-size:2.4rem;}
.header_btn.on span{background:#008b8b;}
.dropupper{display:none; width:100%; background:rgba(255,255,255,.95); box-shadow:0 0 0.4rem 0.4rem rgba(0,0,0,.1); margin-top:6rem; border-radius:0.4rem; padding:1.5rem;}
.dropupper_list{color:#249189; font-size:2.2rem; line-height:1.4;}
.dropupper_list li i{margin-right:1rem;}
.dropupper_list li a{color:#249189; text-decoration:none; padding:1rem; display:block; width:100%;}
.dropupper_list li:nth-child(odd) a{background:#f7f7f7;}
/*=======
Contents
====================*/
.container{width:100%; padding:1.5rem;}
.wrap{width:100%; max-width:128rem; margin:0 auto; background:rgba(255,255,255,.95); box-shadow:0 0 0.3rem 0.3rem rgba(0,0,0,.1); border-radius:0.4rem;}
.contents{width:100%; max-width:100rem; margin:0 auto; padding:2rem;}
.anchor{margin-top:-2em; padding-top:2rem;}
/*=======
Element
====================*/
.contents_item{font-size:4rem; line-height:1.1; text-align:center; margin-bottom:5rem;}
.contents_item strong{border-bottom:solid 0.2rem #555;}
.field{width:100%;}
.field_item{font-size:2.6rem; line-height:1.3; color:#249189; padding-bottom:0.5rem; margin-bottom:2rem; border-bottom:solid 0.2rem #249189;}
.field_item i{margin-right:1rem;}
.field_lead{margin-bottom:2rem;}
.field_inner{margin-bottom:5rem;}
.field_inner__text span{display:block;}
.field_subitem{font-size:2.4rem; margin-bottom:1rem; color:#333;}
.field_subitem i{margin-right:1rem; margin-top:-0.4rem; color:#249189;}
.field_box{position:relative; margin-bottom:4rem;}
.field_box:last-child{margin-bottom:0;}
.field_box:after{position:absolute; left:2rem; bottom:-2rem; z-index:1;
font-family:"FontAwesome"; content:"\f063"; font-size:3rem; color:#555; line-height:0; padding:0; color:#aaa;}
.field_box:last-child:after{content:none;}
.field_balloon{background:#fff; padding:1.5rem; border:solid 0.1rem #aaa; border-radius:0.6rem; position:relative; z-index:2;}
.t-indent{text-indent:2rem;}
.field_balloon__img{display:block; width:100%; margin-top:1.5rem;}
.field_balloon__img img{border-radius:0.4rem;}
.field_list{margin-bottom:2rem;}
.field_list strong{display:inline-block;}
.field_iframe{width:100%; height:40rem;}
/*=======
Footer
====================*/
.footer{padding:2rem; border-top:solid 0.5rem #00a0c6; background:#ff0; border-radius:0 0 0.4rem 0.4rem;}
.footer_logo{width:100%; text-align:center; margin-bottom:1.5rem;}
.footer_logo a{display:block; width:100%; max-width:13rem; margin:0 auto;}
.copyright{width:100%; text-align:center; font-size:1.2rem;}
/*=======
Responsive
====================*/
/*(MIN)---------------------------*/
@media (min-width:62.5625em){/*1001*/
a:hover{-webkit-transition:all 0.15s ease-out; transition:all 0.15s ease-out; opacity:.85; text-decoration:none; color:#249189;}
.header_btn a:hover,.header_btn span:hover{background:#008b8b; color:#fff;}
.dropupper_list li a:hover{background:#249189; color:#fff;}
}
/*(MAX)---------------------------*/
@media (max-width:62.5em){/*1000*/
.header_logo{text-align:left; padding-right:12rem; font-size:4rem;}
}
@media (max-width:48em){/*768*/
body{font-size:1.4rem; background-attachment:scroll;}
.operation_arrow{bottom:2rem; right:2rem;}
.operation_arrow a{width:4.4rem; height:4.5rem; font-size:3rem; line-height:4rem;}
.dropupper_list{font-size:1.6rem;}
.header_logo{font-size:3.5rem;}
.header{padding:2rem;}
.header_wrap{top:3rem; right:2rem; width:calc(100% - 4rem);}
.contents_item{font-size:3.5rem; margin-bottom:3rem;}
}
@media (max-width:40em){/*640*/
.header_logo{font-size:3rem;}
.contents_item{font-size:3rem;}
.field_item{font-size:2.2rem;}
.field_subitem{font-size:2rem;}
.field_inner{margin-bottom:3rem;}
}
@media (max-width:37.5em){/*600*/
}
@media (max-width:31.25em){/*500*/
}
@media (max-width:28.125em){/*450*/
.container{padding:0;}
.header_logo{font-size:2.2rem;}
.contents_item{font-size:2.8rem;}
.header_logo{padding-right:9rem;}
.header_wrap{top:1rem;}
.header_link{width:8.5rem;}
.header_btn a, .header_btn span{width:4rem; height:4rem; line-height:4rem;}
.header_btn i{font-size:2rem;}
.operation_arrow a{width:4rem; height:4rem; font-size:2.5rem; line-height:3.5rem;}
.field_list strong{display:block;}
}
@media (max-width:21.25em){/*340*/
.header_logo{padding-right:7rem;}
}
