@charset "utf-8";
@import url("header.css");
@import url("footer.css");
@import url("component.css");
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500&family=Jost&display=swap');

/**********************************************/
/*CONTRAIL*/
/**********************************************/
* {
    box-sizing: border-box;
}

* html body {
	overflow: hidden;
}

html {
    position: relative;   
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
	margin:0;
	padding:0;
    padding-top: 140px;
    color: #000;
    font-family: 'Heebo',"Arial",'游ゴシック', 'Yu Gothic', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 1.6rem;
    line-height: 1.6;       
    font-weight: 400;
    
    -moz-font-feature-settings: "palt";
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";    
    overflow-x: hidden;    
    position: relative;
}

a {
    color: #0997AF; 
}
a:hover img {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
}
a:hover {
    -webkit-transition: all .5s;
    transition: all .5s;
    color:#000;
    text-decoration: none;
}

b {
    font-weight: 600;
}

/*別窓マーク*/
a[target=_blank][rel=noopener] {
	padding:2px 20px 2px 0;
    background:url("../img/icon_blank.png") no-repeat right center;
    background-size: 14px;
    margin-right: 5px;
}

/*PDFマーク*/
a[type$="pdf"] {
	padding:2px 22px 2px 0;
    background:url("../img/icon_pdf.png") no-repeat right center;
    background-size: 16px;
}

/*見出し*/
/*remはhtmlのfont-sizeが基準となる相対値の単位*/
h1,h2,h3,h4,h5,h6 {
    line-height: 120%;
    font-weight: 500;
    margin: 0;
}

h1 {
	font-size: 3.6rem;
    margin: 0;
}
h2 {
    font-size: 3.2rem;
}
h3 {
    font-size: 2.8rem;
}
h4 {
    font-size: 2.6rem;
}
h5 {
    font-size: 2.4rem;
}
h6 {
    font-size: 2.0rem;
}


.h1-header {
	font-size: 3.6rem;
}
.h2-header {
    font-size: 3.2rem;
}
.h3-header {
    font-size: 2.8rem;
}
.h4-header {
    font-size: 2.6rem;
}
.h5-header {
    font-size:2.4rem;
}
.h6-header {
    font-size:2.0rem;
}



form {
    margin:0;
    padding: 0;
}

img {
    border-width:0;
    max-width: 100%;
    height: auto;
}

p  {
    line-height: 160%;
}

li {
    line-height: 160%;  
}

table {
    border-collapse: collapse;
}
table th {
    font-weight: 400;
}

b {
    font-weight: 500; 
}

strong {
    font-weight: 500; 
}

dt {
    font-weight: 500; 
}

.figure {
    margin: 30px auto;
    padding: 0;
}
.figure img {
    max-width: 100%;
    display: block;
    margin: 0 auto;
}
.figure figcaption {
    font-size: 1.4rem;
    line-height: 140%;
    margin-top: 20px;
}
.figure~.figure {
    margin-top: 50px;
}

/*区切り*/
.section~.section {
    margin-top: 60px;
}

.contents .section:last-child {
    margin-bottom: 50px;
}

pre {
    margin: 0;
    white-space: pre-wrap;
    word-wrap: break-word;
}
sup, sub {
    line-height: 1;
}




/**********************/
/*外枠*/
/**********************/
main {
    margin: 0 auto;
    padding-bottom: 30px;
}


/**********************/
/*コンテンツ*/
/**********************/
.contents {
    width: 100%;
    max-width:1300px;
    margin: 0 auto 0px;
}
.wrapper {
    display: flex;    
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;  

}

/*コンテンツ部分*/
.container {
    width:calc((8.333% * 9) - 60px);
    margin-right: 60px;
    padding: 30px 0;
    order: 1;
}

/*サイドバー*/
.sidebar {
    width:calc(8.333% * 3);    
    order: 2;
}

/*★サイドバー見出し*/
.sidemenu-title {
    font-size: 1.8rem;
    line-height: 100%;

    text-align: center;
    padding: 10px 0;
    margin-bottom: 20px;
}

/*サイドバーメニュー*/
.sidemenu {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.sidemenu li {
    border-bottom: 1px #ddd solid;
    padding: 15px 5px;
    line-height: 100%;
    color:#000;
    font-size: 1.8rem;
}
.sidemenu li a {
    background:url("../img/icon_link-b.png") no-repeat left center;
    background-size: 14px;
    padding-left: 25px;
    text-decoration: none;
    color:#000;
    display: block;
}
.sidemenu li a:hover {
    -webkit-transition: all .5s;
    transition: all .5s;
    color: #ddd;
}

/*★サイドバーサブメニュー*/
.side-child {
    width: 100%;
    margin: 10px 0 0px;
    padding: 0;
    list-style: none;
}
.side-child li {
    padding: 5px 5px;
    margin-left: 20px;
}




/****************************/
/*レスポンシブ*/
/****************************/
@media screen and (max-width: 1400px) {
    .contents {
        padding: 0 20px;
    }
}

@media screen and (max-width: 1280px) {
}

@media screen and (max-width: 980px) {
}

@media screen and (max-width: 780px) {
    body {
        font-size: 1.4rem;
    }

    .h1-header {
        font-size: 3.0rem;
    }
    .h2-header {
        font-size: 2.6rem;
    }
    .h3-header {
        font-size: 2.2rem;
    }
    .h4-header {
        font-size: 2.0rem;
    }
    .h5-header {
        font-size: 1.8rem;
    }
    .h6-header {
        font-size: 1.6rem;
    }
    
    .container {
        width: 100%;
        margin-right: 0;
        padding: 0 0 30px;
        order: 1;
    }
    .sidebar {
        width: 100%;
        margin-bottom: 50px;
    }
    .sidemenu li {
        padding: 15px 5px;
        font-size: 1.4rem;
    }
}


@media screen and (max-width: 580px) {
    .h1-header {
        font-size: 2.6rem;
    }
    .h2-header {
        font-size: 2.2rem;
    }
    .h3-header {
        font-size: 2.0rem;
    }
    .h4-header {
        font-size: 1.9rem;
    }
    .h5-header {
        font-size: 1.8rem;
    }
    .h6-header {
        font-size:1.6rem;
    }

    .section~.section {
        margin-top: 50px;
    }
}

@media screen and (max-width: 380px) {
}
