@charset "UTF-8";

/*
 * CSS for KGB website
 * Copyright (C) 2015-2020 KGB.
 */

/* General */

body {
    font-family: "Segoe UI", "Hiragino Kaku Gothic ProN", Meiryo, Arial, "MS UI Gothic", sans-serif;
    font-size: 12pt;
    line-height: 2;
    color: #03004C;
    background-color: #fffafa;
    margin: 0px;
    padding: 0px;
}

/*
::selection {
    background-color: #FFFFFF;
    color: #586E75;
}

::-moz-selection {
    background-color: #FFFFFF;
    color: #586E75;
}
*/


h1, h2 {
    font-family: "Segoe UI", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, Arial, "MS UI Gothic", sans-serif;
    font-weight: bold;
    color: #03004C;
    border-left: solid 3px #FF0088;
    border-bottom: solid 1px #FF0088;
    padding: 1px 7px;
}

h1 {
    font-size: 170%;
}

h2 {
    font-size: 135%;
}

h3 {
    font-family: "Segoe UI", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, Arial, "MS UI Gothic", sans-serif;
    color: #03004C;
    border-bottom: dotted 1px #777777;
    padding: 1px 10px;
    font-size: 120%;
}

p {
    margin: 7px 0px 15px;
    text-align: justify;
}


.ls {
    float: left;
}

.rt {
    text-align: right;
}

.rs {
    float: right;
}

.media{
    vertical-align: middle;
    text-align: center;
    margin: 5px auto 20px;
}

a:link {
    color: #009BE4;
}

a:visited {
   
}

a:hover {
    color: #CB4B16;
    background-color: #EEE8D5;
}

a:active {
    color: #6C71C4;
    background-color: #EEEAD5;
}

hr {
    border: dotted 1px #EEEAD5;
}

em {
    color: #D33682;
    font-style: normal;
}

strong {
    color: #D33682;
    font-weight: bold;
}

i {
    text-decoration: italic;
}

var {
    text-decoration: italic;
}

sup {
    vertical-align: super;
    font-size: 75%;
}

sub {
    vertical-align: baseline;
    font-size: 60%;
}

img,video,iframe {
    border: none;
    max-width: 100%;
    height: auto;
}

.column {
    overflow: hidden;
    background-color: rgb(255, 240, 240);
    border-radius: 10px;
    margin: 10px;
	padding: 0px 10px;
}

.column h3 {
    margin: 0px;
    padding: 0px;
}

/*
p::before {
    content: "　";
}
*/

/*
 * List
 * Thanks to: http://stackoverflow.com/questions/5306640
 */

ul {
    list-style: disc;
}

li::before {
    /*content: "●";*/
    color: #888888;
    margin-right: 6px;
    font-size: 85%;
}


#logo {
    height: 45px;
    width: auto;
    margin-right: 3px;
    margin-top: 20px;
}

#whole {
	overflow: hidden;
	max-width: 1200px;
	margin: 30px auto 0;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
	padding: 20px 40px 40px;
	background: #FFFFFF;
}

/* Header */

header {
    border-bottom: solid 1px #AAAAAA;
    margin-bottom: 15px;
    /*min-height: 55px;*/
}

header h1 {
    border: none;
    padding: 0px;
    margin: 0px;
    font-weight: bold;
    color: #151175;
    font-size: 45px;
    display: inline;
    vertical-align: top;
}

header h1 a:link, header h1 a:visited, header h1 a:hover, header h1 a:active {
    color: #151175;
    text-decoration: none;
    vertical-align: top;
}

h1 a:hover {
    background-color: #EEE8D5;
}

/* main */

#main {
	/*overflow: hidden;*/
	float: right;
	width: 70%;
}

/* menu */

#menu {
	float: left;
	width: 25%;
    text-align: left;
}

#menu ul {
    font-size: 135%;
    line-height: 2;
}

#menu_phone{
    display: none;
}

/* footer */

footer {
    border-top: solid 2px #EEEAD5;
}

/*スマホ用*/
@media screen and (max-width:768px){

#whole{
    margin: 10px auto 0;
    padding: 10px;
}

header h1{
    font-size: 28px;
    margin: 3px;
    padding: 0;
}

#logo {
    height: 36px;
    width: auto;
    margin-right: 1px;
    margin-top: 10px;
}

#menu{
    display:none;
}

#menu_phone{
    display: block;
}

#main{
	float: none;
	width: 100%;
}

}