
html
{
    min-height: 100%;
    position: relative;
}

body {
margin-bottom: 20px;
}

a:link { color: #666; } 
a:visited { color: #666; }
a:hover { color: #ccc; } 
a:active { color: #ccc; } 

a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}


.mb10 {
margin-bottom: 10px;
}
.mb20 {
margin-bottom: 20px;
}
.mb30 {
margin-bottom: 30px;
}
.mb40 {
margin-bottom: 40px;
}
.mb50 {
margin-bottom: 50px;
}
.mb120 {
margin-bottom: 120px;
}


img {
	max-width:100%;
	height: auto;
	display: block;
}

p {
margin-bottom: 1em;
}

p.indent:before
{
	content:" ";	
	padding-left: 1em;
	text-indent:-1em;
}

p.num,p.indent {
padding-left:1em;
text-indent:-1em;
}



div.tree {
padding-left:1em;
text-indent:-1em;
}

.tree_child {
padding-left: 2em;
}

.tree_child2 {
padding-left: 4em;
}

.red {
color: red;
}



.header
{
    max-width: 100%;
    background-image: url('img/bar.png');
    background-repeat: repeat-x;
    height: 60px;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    margin: 0;
    background-position: left;
    display: block;
}


.header > .container > div {
display: table;
height: 60px;
}

.header > .container > div > h1 {
display: table-cell;
vertical-align: middle;
text-align: left;
color: #fff;
font-size: 20px;
}



/*ガター幅調整*/

.no-gutter > [class*='col-']
{
    height: 60px;
    padding: 0;
    overflow: hidden;
}

h3.top-page-title
{
    display: block;
    width:110px;
    border: 1px solid #eb5505;
    white-space: nowrap;
    color: #eb5505;
    text-align: center;
    letter-spacing: 1em;
    margin-top: -5px;
    font-size: 20px;
    padding-top: 2em;
    padding-right:0;
    padding-bottom: 2em;
    padding-left: 1em;
    margin-bottom: 30px;
}


.page_title_bar
{
    width: 100%;
    height: 116px;
    margin-top: 70px;
    margin-bottom: 35px;
    display: block;
}

.win_logo
{
    background-image: url('img/win/win_logo.png');
    background-repeat: no-repeat;
    background-position: center right;
}

.apple_logo
{
    background-image: url('img/mac/apple_logo.png');
    background-repeat: no-repeat;
    background-position: center right;
}

.page_title01,
.page_title02,
.page_title03,
.page_title04,
.page_title05,
.page_title06,
.page_title07,
.page_title08,
.page_title09,
.page_title10
{
    height: 116px;
    width:inherit;
    display: table;
    vertical-align: middle;
}

/* ページタイトル */

.page_title01 {
background: url('img/p01_title.png') no-repeat left center;
}

.page_title02 {
background: url('img/p02_title.png') no-repeat left center;
}

.page_title03 {
background: url('img/p03_title.png') no-repeat left center;
}

.page_title04 {
background: url('img/p04_title.png') no-repeat left center;
}

.page_title05 {
background: url('img/p05_title.png') no-repeat left center;
}

.page_title06 {
background: url('img/p06_title.png') no-repeat left center;
}

.page_title07 {
background: url('img/p07_title.png') no-repeat left center;
}

.page_title08 {
background: url('img/p08_title.png') no-repeat left center;
}

.page_title09 {
background: url('img/p09_title.png') no-repeat left center;
}

.page_title10 {
background: url('img/p10_title.png') no-repeat left center;
}

hr.line {
border: 1px solid #ccc;
margin-bottom: 30px;
}


.page_title01 > h3.title,
.page_title02 > h3.title,
.page_title03 > h3.title,
.page_title04 > h3.title,
.page_title05 > h3.title,
.page_title06 > h3.title,
.page_title07 > h3.title,
.page_title08 > h3.title,
.page_title09 > h3.title,
.page_title10 > h3.title
{
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    white-space: nowrap;
    color: #666;
    font-weight: nomal;
}

.page_title01 > h3.title,
.page_title02 > h3.title,
.page_title03 > h3.title,
.page_title04 > h3.title,
.page_title05 > h3.title,
.page_title06 > h3.title,
.page_title07 > h3.title,
.page_title08 > h3.title,
.page_title09 > h3.title
{
	padding-left: 100px;
}

.page_title10 > h3.title
{
 padding-left: 174px;
}
    

h4.title
{
    background-color: #999;
    color: #ffffff;
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    padding: 10px;
    margin-bottom: 22px;
}

.menu01,
.menu02,
.menu03,
.menu04,
.menu05,
.menu06,
.menu06,
.menu07,
.menu08,
.menu09,
.menu10
{
    display: table;
    height: 63px;
    width: 100%;
    margin-bottom: 30px;
}

.menu01 > h3,
.menu02 > h3,
.menu03 > h3,
.menu04 > h3,
.menu05 > h3
{
padding-left: 74px;
}

.menu10 > h3 {
padding-left: 104px;
}


.menu01 > h3,
.menu02 > h3,
.menu03 > h3,
.menu04 > h3,
.menu05 > h3,
.menu06 > h3,
.menu06 > h3,
.menu07 > h3,
.menu08 > h3,
.menu09 > h3,
.menu10 > h3
{
	display: table-cell;
	vertical-align: middle;
	letter-spacing: 0.1em;
    font-size: 16px;
}

.menu01 > h3 > a,
.menu02 > h3 > a,
.menu03 > h3 > a,
.menu04 > h3 > a,
.menu05 > h3 > a,
.menu06 > h3 > a,
.menu06 > h3 > a,
.menu07 > h3 > a,
.menu08 > h3 > a,
.menu09 > h3 > a,
.menu10 > h3 > a
{
	font-weight: 600;
}

.contents_margin {
margin-top: 100px;
}


.menu01
{
    background: url('img/contents_num01.png') no-repeat;
    background-position: 0 0;
}

.menu02
{
    background: url('img/contents_num02.png') no-repeat;
    background-position: 0 0;
}

.menu03
{
    background: url('img/contents_num03.png') no-repeat;
    background-position: 0 0;
}

.menu04
{
    background: url('img/contents_num04.png') no-repeat;
    background-position: 0 0;
}

.menu05
{
    background: url('img/contents_num05.png') no-repeat;
    background-position: 0 0;
}


.menu10
{
    background: url('img/contents_num10.png') no-repeat;
    background-position: 0 0;
}


@media (min-width:768px){
.menu06
{
    background: url('img/contents_num06.png') no-repeat;
    background-position: 0 0;
}

.menu07
{
    background: url('img/contents_num07.png') no-repeat;
    background-position: 0 0;
}

.menu08
{
    background: url('img/contents_num08.png') no-repeat;
    background-position: 0 0;
}

.menu09
{
    background: url('img/contents_num09.png') no-repeat;
  
}

.menu06 > h3,
.menu07 > h3,
.menu08 > h3,
.menu09 > h3
{
padding-left: 104px;
}


}

@media (max-width:767px){
.menu06
{
    background: url('img/contents_num06.png') no-repeat;
    background-position: -34px 0;
}

.menu07
{
    background: url('img/contents_num07.png') no-repeat;
    background-position: -35px 0;
}

.menu08
{
    background: url('img/contents_num08.png') no-repeat;
    background-position: -35px 0;
}

.menu09
{
    background: url('img/contents_num09.png') no-repeat;
    background-position: -34px 0;
}

.menu06 > h3,
.menu07 > h3,
.menu08 > h3,
.menu09 > h3
{
padding-left: 74px;
}

}



ul.under_button {
position: fixed;
left: 50%;
top:100%;
margin-left: -235px;
margin-top: -80px;
width:470px;
padding-left: -20px;
padding-top: 10px;
padding-bottom: 10px;
list-style-type: none;
display: block;
background-color: rgba(235, 85, 5, .6);
border-radius: 10px;
text-align: center;
clear:both;
z-index: 10;
}

ul.under_button_sub {
position: fixed;
left: 50%;
top:100%;
margin-left: -160px;
margin-top: -80px;
width:320px;
padding-left: -20px;
padding-top: 10px;
padding-bottom: 10px;
list-style-type: none;
display: block;
background-color: rgba(235, 85, 5, .6);
border-radius: 10px;
text-align: center;
clear:both;
z-index: 10;
}

ul.under_button > li > a,
ul.under_button_sub > li > a
 {
float:left;
display: inline-block;
margin-right: 10px;
width:140px;
padding-top: 3px;
padding-bottom: 3px;
white-space: nowrap;
background-color: white;
border: 1px solid #eb5505;
border-radius: 6px;
font-size: 14px;
color: #eb5505;
text-align: center;
vertical-align: middle;
}

ul.under_button > li > a:hover {
background: #eb5505;
color: #fff;
text-decoration: none;
}



.footer
{
    position: absolute;
    width: 100%;
    max-width: 100%;
    height: 20px;
    background-image: url('img/bar.png');
    background-repeat: repeat-x;
    bottom: 0;
}

div.container > img,
div.container > small > img {
max-width:450px
}

