@charset "utf-8";

@import url("color.css");
@import url("font.css");

/*===============================================
●tablet.css 画面の横幅が1023pxまで
===============================================*/
@media screen and (max-width: 1023px) {

    img {
        max-width: 100%;
        height: auto;
        width /***/: auto;
    }
	
	h1 {
		font-size: 20px;
		line-height: 40px;
		height: 40px;
		margin-top: 0px;
		padding-left: 10px;
		font-weight: normal;
	}

    /*共通部分*/

    html {
        height: 100%;
    }

    body {
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
        font-size: 12px;
        letter-spacing: 0.1em;
        height: 100%;
		background-color: #fafafa;
    }

    #container {
        width: 100%;
        min-height: 100%;
        height: auto;
        background-image:url(./../img/back_leaf.jpg);
        background-repeat: repeat-y;
        background-position: center top;
    }

    header {
        background:url(./../img/head_bg.jpg) repeat-x;
        width: 100%;
        height: 40px;
    }

        header h1 {
            color: #FFFFFF;
            font-size: 26px;
            background: transparent;
            font-weight: normal;
            padding-left: 10px;
        }

    #head_icon {
        width: 50px;
    }

    footer {
        width: 100%;
        height: 90px;
        position: relative;
        bottom: 0px;
    }

    #ft_bar {
        width: 100%;
        height: 26px;
        background-color: #c78198;
        position: absolute;
        top: 64px;
    }

    #ft_icon {
        width: 100%;
        text-align: center;
        position: absolute;
        top: 23px;
    }

    footer p {
        position: absolute;
        top: 64px;
        color: #FFF;
        font-size: 14px;
        height: 25px;
        margin-top: 4px;
        width: 100%;
        text-align: center;
    }

    address {
        text-align: right;
        margin-right: 20px;
        font-style: normal;
        position: relative;
        z-index: 6;
    }

        address strong {
            font-size: 12px;
        }

            address strong a {
                font-style: normal;
                text-decoration: none;
                color: #000000;
            }

                address strong a:hover {
                    color: #999999;
                }

    .clearfix:after {
        content: ".";
        display: block;
        height: 0;
        font-size: 0;
        clear: both;
        visibility: hidden;
    }

    .clearfix {
        display: inline-block;
    }
    /* Hides from IE Mac */
    * html .clearfix {
        height: 1%;
    }

    .clearfix {
        display: block;
    }
    /* End Hack */

    .left {
        float: left;
    }

    .right {
        float: right;
    }

	#sub_menu h1{
		display:block;
		height:auto;
	}
	.changeTitle{
		display:block;
		text-align:right;
		float:inherit;
		font-size:12px;
	}
	
	#changelang{
		display:inline;
	}
	
	#sub_menu select {
		margin: 5px 5px 5px 2px;
		font-size:100%;
	}
	
	#changeDesign{
		display:inline;
	}
    /*================================
サブページ共通部品
==================================*/


    #content_box {
        width: 725px;
        /*background-color:#eee;
	min-height:600px;*/
        margin-top: 10px;
        margin-left: auto;
        margin-right: auto;
    }

    #sub_menu {
        width: 100%;
        padding-bottom: 0px;
    }
	#sub_menu:after{
		visibility: hidden;
		display: block;
		content: " ";
		clear: both;
		height: 0;
	}
    #sub_menu_head {
        width: 210px;
        background:url(./../img/list2.png) no-repeat #c78198;
        height: 37px;
        line-height: 37px;
        color: #FFFFFF;
        font-size: 14px;
        padding-left: 30px;
        margin-bottom: 5px;
        font-weight: normal;
    }

    #sub_menu_foot {
        width: 210px;
        background:url(./../img/list3.png) no-repeat #d1ceca;
        height: 40px;
        line-height: 40px;
        color: #FFFFFF;
        font-size: 14px;
        padding-left: 30px;
        margin-top: 25px;
        font-weight: normal;
    }

/*
    #sub_menu_snd_title {
        width: 200px;
        background:url(./../img/icon_snd2.jpg) no-repeat #e0a396;
        height: 40px;
        line-height: 40px;
        color: #333;
        font-size: 14px;
        padding-left: 40px;
        margin-bottom: 5px;
        font-weight: normal;
    }
*/
    .sub_menu_snd {
        width: 200px;
        padding-left: 40px;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 1.4em;
    }

        .sub_menu_snd:before {
            content: '';
            display: inline-block;
            height: 100%;
            vertical-align: middle;
            margin-right: -0.25em;
        }

    #sub_menu_talk_title {
        width: 200px;
        height: 40px;
        line-height: 40px;
        color: #333;
        font-size: 14px;
        padding-left: 40px;
        margin-bottom: 5px;
        /*margin-top:10px;*/
        font-weight: normal;
    }
    .sub_menu_talk {
        width: 200px;
        padding-left: 40px;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 1.4em;
    }

        .sub_menu_talk:before {
            content: '';
            display: inline-block;
            height: 100%;
            vertical-align: middle;
            margin-right: -0.25em;
        }

    #sub_menu_bunpou_title {
        width: 200px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
        padding-left: 40px;
        margin-top: 10px;
    }

	#footer a:link, #footer a:visited{
		color:#FFF;
		text-decoration:none;
	}

	#footer a:hover{
		color:#333;
	}

    #footer2 {
        width: 100%;
        height: 26px;
        bottom: 0px;
        background-color: #c78198;
    }

        #footer2 p {
            position: absolute;
            top: 4px;
            color: #FFF;
            font-size: 14px;
            height: 21px;
            margin-top: 0px;
            width: 100%;
            text-align: center;
        }

    #footer3 {
        width: 100%;
        height: 50px;
        bottom: 0px;
        background-color: #c78198;
    }

        #footer3 p {
            position: absolute;
            top: 4px;
            color: #FFF;
            font-size: 14px;
            height: 21px;
            margin-top: 0px;
            width: 100%;
            text-align: center;
        }

    #contents_outer_pane, #sub_content{
        padding-bottom: 0px;
        margin-left: 0px;
    }

    #inyou {
        width: 465px;
        text-align: right;
        margin-top: 30px;
        line-height: 1.4em;
    }



    /*==================================
sub01用
===================================*/

    #t_path {
        height: auto;
        line-height: 20px;
        margin-top: 25px;
        width: 725px;
        margin-left: auto;
        margin-right: auto;
    }

        #t_path a {
            color: #FFF;
            text-decoration: none;
        }

            #t_path a:hover {
                color: #0CF;
                text-decoration: none;
            }

    #sub01_c_title {
        height: 75px;
        padding-left: 20px;
        padding-top: 10px;
        position: relative;
    }

        #sub01_c_title h1 {
            font-size: 30px;
            line-height: 50px;
            height: 50px;
            margin-top: 0px;
            /*border-left:3px solid #eee;
	padding-left:10px;*/
        }

        #sub01_c_title h2 {
            font-size: 18px;
            position: absolute;
            top: 50px;
            right: 15px;
        }

    .sub01_c_clm {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
		margin-top: 20px;
    }

        .sub01_c_clm h3 {
            font-weight: normal;
            height: 30px;
            font-size: 16px;
            line-height: 30px;
            padding-left: 15px;
        }

        .sub01_c_clm p {
            padding: 20px;
            font-size: 15px;
            letter-spacing: 1px;
            line-height: 1.3em;
        }

        .sub01_c_clm #course_desc {
            padding: 20px;
            font-size: 15px;
            letter-spacing: 1px;
            line-height: 1.3em;
        }

    #sub01_aside {
        text-align: center;
        height: 22px;
        padding-top: 6px;
    }

    #sub01_aside_in {
        width: 400px;
        font-size: 14px;
        margin: auto;
    }

/********************************/
    .ques_text {
        line-height: 2.5;
    }

    .ques_box {
        height: auto;
        padding: 5px 10px;
    }

    .ques_number {
        line-height: 3.5;
    }

    .ques_item_box {
        margin-top: 20px;
        padding-left: 20px;
    }

    .pro_in_menu_container {
        margin-bottom: 20px;
        line-height: 45px;
        font-size: 16px;
        text-align: center;
        float: left;
        width: 270px;
    }

        .pro_in_menu_container a {
            color: #333;
            text-decoration: none;
        }

    .pro_in_menu {
        background: url(../img/top_cursor.png);
        width: 120px;
        height: 40px;
        float: left;
        margin-right: 10px;
    }

    .pro_in_menu_off {
        width: 120px;
        height: 40px;
        float: left;
        margin-right: 10px;
    }


    /**
 * ドラッグアンドドロップ
 */
    .match_drag_ul {
        padding: 5px 10px;
        width: 180px;
        float: left;
        margin-right: 15px;
    }

        .match_drag_ul li {
            height: 40px;
            border: solid 1px #AAAAAA;
            margin-bottom: 25px;
            padding: 5px;
            line-height: 40px;
            text-align: center;
            background-color: #FFFFFF;
            cursor: move;
        }

    .match_drop_ul {
        padding: 5px 0px;
        width: 180px;
        float: left;
    }

        .match_drop_ul li {
            height: 40px;
            border: solid 1px #AAAAAA;
            margin-bottom: 25px;
            padding: 5px;
            line-height: 40px;
            text-align: right;
            background-color: #EDE8E4;
        }

    /**
 * sort用ドラッグアンドドロップ
 *
 */
    .sort_p_mg {
        margin: 0px 5px;
    }

    .sort_drag_box {
        display: inline-block;
        width: 40px;
        border-bottom: dotted 1px #AAAAAA;
        text-align: center;
    }

    .sort_drag_ul {
        border: solid 1px #AAAAAA;
        padding: 5px 10px;
        width: 300px;
        margin-top: 20px;
        margin-bottom: 20px;
        padding-top: 15px;
    }

        .sort_drag_ul li {
            float: none;
            width: auto;
            height: 40px;
            padding: 5px 10px;
            line-height: 40px;
            border: solid 1px #AAAAAA;
            margin-right: 10px;
            margin-bottom: 10px;
            background-color: #FFFFFF;
            cursor: move;
        }
		
    /* umeno add from here vvvv */
    .answerBlock {
        position: absolute;
        top: 10px;
        left: 10px;
        width: 460px;
        border: solid;
        opacity: 0.9;
        background-color: white;
        display: none;
        border:solid;
    }
        .answerBlock h1 {
            TEXT-ALIGN: center;
        }

        .answerBlock p {
            font-size: 120%;
            padding: 20px;
        }

        .answerBlock div {
            margin: 20px;
        }

    .ques_block {
        position: relative;
    }
    /* umeno add from ^^^^^ */

	#t_path3{
		/*height:20px;*/
		line-height:20px;
		margin-top:25px;
		width:725px;
		margin-left:auto;
		margin-right:auto;
	}

	.dia_child_menu li {
		width:200px;
		height:30px;
		line-height:30px;
		padding-left:40px;
	}
	#dia_child_menu0,#dia_child_menu1,#dia_child_menu2,#dia_child_menu3{
		height:0px;
		visibility:hidden;
	}
	#dia_child_menu0:target{
		height:auto;
		visibility:visible;
	}
	#dia_child_menu1:target{
		height:auto;
		visibility:visible;
	}
	#dia_child_menu2:target{
		height:auto;
		visibility:visible;
	}
	#dia_child_menu3:target{
		height:auto;
		visibility:visible;
	}
	.dia_menu{
		width:190px;
		min-height:19px;
		padding-left:50px;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.dia_menu:before {
	  content: '';
	  display: inline-block;
	  height: 100%;
	  vertical-align: middle;
	  margin-right: -0.25em;
	}
	.dia_menu li{
		font-size:14px;
		display: inline-block;
		vertical-align: middle;
	}

	h1{
		font-size:20px;
		line-height:40px;
		/*height:40px;*/
		margin-top:0px;
		padding-left:10px;
		font-weight:normal;
	}
	#dia_video_none {
		width: 0px;
		height: 0px;
	}
	#dia_uc_left{
		width:10px;
	}
	#dia_uc_right{
		height:150px;
		padding-left:20px;
		padding-right:20px;
		padding-top:15px;
		vertical-align:top;
		font-size:16px;
	}
	.dia_uc_char{
		padding-left:10px;
	}
	.dia_uc_icon{
		vertical-align:middle;
	}
	.dia_uc_mescon{
		margin-bottom:10px;
	}
	#dia_uc_toggle{
		margin-bottom:5px;
	}
	#dia_uc_toggle_3{
		margin-top:10px;
		margin-bottom:0px;
		font-size:11pt;
	}
	.dia_td_left {
		padding: 5px;
	}

	.dia_td_right {
		height: auto;
		padding-left: 20px;
		padding-right: 20px;
		padding-top: 15px;
		vertical-align: top;
		font-size: 16pt;
	}
	#dia_video{
		width:465px;
		height:auto;
		margin-left:auto;
		margin-right:auto;
		margin-top:15px;
	}
	#dia_vide_embed {
		width: 465px;
		height: 310px;
	}
	.dia_td_left {
		padding: 5px;
		width: 10%;
	}

	.dia_td_right {
		height: auto;
		padding-left: 20px;
		padding-top: 15px;
		vertical-align: top;
		font-size: 16pt;
		width: 85%;
	}
	#dia_video_langchange_3 {
		width: 465px;
		height: 54px;
		float: left;
		margin-top: 10px;
		position: relative;
		text-align: center;
		line-height: 54px;
		font-size: 11pt;
		margin-bottom: 10px;
	}
	#dia_float_right_3 {
		float: right;
		width: 465px;
	}
	#dia_video_3{
		width:465px;
		/*height:372px;*/
		height:auto;
		background-color:#CCC;
		margin-left:auto;
		margin-right:auto;
		margin-top:10px;
	}
	#dia_video_btn{
		width:465px;
		height:54px;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:25px;
		position:relative;
		text-align:center;
		position:relative;
	}
	#dia_video_btn img{
		margin-top:10px;
	}
	#dia_video_lang{
		text-align:right;
		font-size:14px;
		position:absolute;
		top:8px;
		right:5px;
		line-height:1.4em;
	}
	#dia_video_lang img{
		margin-top:0px;
	}
	#dia_video_langchange {
		width: 270px;
		height: 54px;
		float: left;
		margin-top: 20px;
		position: relative;
		text-align: center;
		line-height: 54px;
		font-size: 9pt;
	}
	#dia_video_btn_2{
		width:180px;
		height:54px;
		float: right;
		margin-bottom:10px;
		margin-top:10px;
		position:relative;
		text-align:center;
		position:relative;
	}
	#dia_video_btn_3{
		width:465px;
		height:54px;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:15px;
		position:relative;
		text-align:center;
		position:relative;
	}
	#dia_video_btn img, #dia_video_btn_2 img, #dia_video_btn_3 img{
		margin-top:10px;
	}

	#dic_c{
		position:relative;
	}
	#dia_c_top{
		height:50px;
		line-height:50px;
		padding-left:10px;
		font-size:16px;
		margin-top:10px;
	}
	#dia_c_top div {
		display: inline-block;
	}
	#dia_c_char{
		height:70px;
		padding-left:10px;
		font-size:13px;
		padding:10px;
		line-height:1.4em;
	}
	#dia_c_btn{
		position:absolute;
		top:0px;
		right:0px;
	}
	#dia_c_btn table{
		border-collapse:separate;
		border-spacing:5px;
		margin-top:3px;
		color:#333;
	}
	#dia_c_btn_on{
		width:46px;
		height:32px;
		background:url(./../img/dia_onoff_bg2.jpg) no-repeat;
		line-height:32px;
		text-align:center;
		color:#333;
		font-size:15px;
	}
	#dia_c_btn_off{
		width:46px;
		height:32px;
		background:url(./../img/dia_onoff_bg.jpg) no-repeat;
		line-height:32px;
		text-align:center;
		color:#bbb;
		font-size:15px;
	}
	#video{
		width:100%;
	}
	.toggle_lang{
		width: 60px;
		height: 25px;
		font-size: 14px;
		background-color: #388;
		color: #fff;
		margin-bottom: 5px;
	}
}